Represents a base class for domain charts with X/Y axes

Hierarchy

Hierarchy

Constructors

Properties

Accessors

Methods

Constructors

Properties

context: any

If using the new style context, re-declare this in your class to be the React.ContextType of your static contextType. Should be used with type annotation or static contextType.

static contextType = MyContext
// For TS pre-3.7:
context!: React.ContextType<typeof MyContext>
// For TS 3.7 and above:
declare context: React.ContextType<typeof MyContext>
props: Readonly<IIgrFinancialChartProps> & Readonly<{
    children?: ReactNode;
}>
refs: {
    [key: string]: ReactInstance;
}

Type declaration

  • [key: string]: ReactInstance
state: Readonly<{}>
contextType?: Context<any>

If set, this.context will be set at runtime to the current value of the given Context.

Usage:

type MyContext = number
const Ctx = React.createContext<MyContext>(0)

class Foo extends React.Component {
static contextType = Ctx
context!: React.ContextType<typeof Ctx>
render () {
return <>My context's value: {this.context}</>;
}
}

Accessors

  • get actualBrushes(): string[]
  • Gets the actual palette of brushes to use for coloring the chart series.

    Returns string[]

  • set actualBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get actualOutlines(): string[]
  • Gets the actual palette of brushes to use for outlines on the chart series.

    Returns string[]

  • set actualOutlines(v): void
  • Parameters

    • v: string[]

    Returns void

  • get actualXAxisLabelTextColor(): string
  • Gets the actual color of labels on the X-axis

    Returns string

  • set actualXAxisLabelTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get actualYAxisLabelTextColor(): string
  • Gets the actual color of labels on the Y-axis

    Returns string

  • set actualYAxisLabelTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get alignsGridLinesToPixels(): boolean
  • Gets or sets a value indicating whether grid and tick lines are aligned to device pixels.

    Use AlignsGridLinesToPixels propert to indicat whether grid and tick lines are aligned to device pixels.

     this.chart.alignsGridLinesToPixels= true;
    

    Returns boolean

  • set alignsGridLinesToPixels(v): void
  • Parameters

    • v: boolean

    Returns void

  • get animateSeriesWhenAxisRangeChanges(): boolean
  • Gets or sets whether the series animations should be allowed when a range change has been detected on an axis.

    Returns boolean

  • set animateSeriesWhenAxisRangeChanges(v): void
  • Parameters

    • v: boolean

    Returns void

  • get applyCustomIndicators(): ((s, e) => void)
  • Event raised by the chart when custom indicator data is needed from the application. During series rendering, event will be raised once for each value in the CustomIndicatorNames collection.

    Returns ((s, e) => void)

      • (s, e): void
      • Event raised by the chart when custom indicator data is needed from the application. During series rendering, event will be raised once for each value in the CustomIndicatorNames collection.

        Parameters

        Returns void

  • set applyCustomIndicators(ev): void
  • Parameters

    Returns void

  • get areaFillOpacity(): number
  • Gets or sets the fill opacity for all series that have area visuals in this chart. For example, Area, SplineArea, Column chart types

    Returns number

  • set areaFillOpacity(v): void
  • Parameters

    • v: number

    Returns void

  • get autoCalloutsVisible(): boolean
  • Gets or sets if the auto value callouts should be displayed.

    Returns boolean

  • set autoCalloutsVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get bottomMargin(): number
  • Gets or sets the bottom margin around the chart content.

    Use the bottomMargin property for the bottom margin around the chart content.

    this.chart.bottomMargin=20;
    
     <IgrCategoryChart dataSource={this.state.data}
    bottomMargin= 20 />

    Returns number

  • set bottomMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get brushes(): string[]
  • Gets or sets the palette of brushes to use for coloring the chart series. The value provided should be an array of CSS color strings or JavaScript objects defining gradients. Optionally the first element can be a string reading "RGB" or "HSV" to specify the interpolation mode of the collection

    Use the Brushes property to set the brushes.

    this.chart.brushes = ["#ff0000","#00ff00"];
    

    Returns string[]

  • set brushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get calloutStyleUpdating(): ((s, e) => void)
  • Occurs when the style of a callout is updated.

    Returns ((s, e) => void)

  • set calloutStyleUpdating(ev): void
  • Parameters

    Returns void

  • get calloutStyleUpdatingEventEnabled(): boolean
  • Gets or sets if event annotations should be displayed.

    Returns boolean

  • set calloutStyleUpdatingEventEnabled(v): void
  • Parameters

    • v: boolean

    Returns void

  • get calloutsContentMemberPath(): string
  • Gets or sets the member path of the content data for the callouts.

    Returns string

  • set calloutsContentMemberPath(v): void
  • Parameters

    • v: string

    Returns void

  • get calloutsDataSource(): any[]
  • Returns any[]

  • set calloutsDataSource(value): void
  • Parameters

    • value: any[]

    Returns void

  • get calloutsLabelMemberPath(): string
  • Gets or sets the member path of the label data for the callouts.

    Returns string

  • set calloutsLabelMemberPath(v): void
  • Parameters

    • v: string

    Returns void

  • get calloutsVisible(): boolean
  • Gets or sets if callouts should be displayed.

    Returns boolean

  • set calloutsVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get calloutsXMemberPath(): string
  • Gets or sets the member path of the X data for the callouts.

    Returns string

  • set calloutsXMemberPath(v): void
  • Parameters

    • v: string

    Returns void

  • get calloutsYMemberPath(): string
  • Gets or sets the member path of the Y data for the callouts.

    Returns string

  • set calloutsYMemberPath(v): void
  • Parameters

    • v: string

    Returns void

  • get chartTemplate(): any
  • Returns any

  • set chartTemplate(value): void
  • Parameters

    • value: any

    Returns void

  • get chartTitle(): string
  • Gets or sets text to display above the plot area.

    Use the Title property to display the text above the plot area.

     this.chart.title= "This is a Title";
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    title= "CategoryChart Subtitle" />

    Returns string

  • set chartTitle(v): void
  • Parameters

    • v: string

    Returns void

  • get chartType(): FinancialChartType
  • The type of price series to display in the main chart.

    Use the ChartType property to set a type of series that will be used to render prices in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    chartType="Candle"
    dataSource={this.data} />

    Returns FinancialChartType

  • set chartType(v): void
  • Parameters

    Returns void

  • get chartTypePickerTemplate(): any
  • Returns any

  • set chartTypePickerTemplate(value): void
  • Parameters

    • value: any

    Returns void

  • get computedPlotAreaMarginMode(): ComputedPlotAreaMarginMode
  • Gets or sets mode to use for automatically calculating the plot area margin.

    Returns ComputedPlotAreaMarginMode

  • set computedPlotAreaMarginMode(v): void
  • Parameters

    Returns void

  • get crosshairsAnnotationEnabled(): boolean
  • Gets or sets whether annotations are shown along the axis for crosshair values

    Returns boolean

  • set crosshairsAnnotationEnabled(v): void
  • Parameters

    • v: boolean

    Returns void

  • get crosshairsAnnotationXAxisBackground(): string
  • Gets or sets the background of crosshair annotation on x-axis.

    Returns string

  • set crosshairsAnnotationXAxisBackground(v): void
  • Parameters

    • v: string

    Returns void

  • get crosshairsAnnotationXAxisPrecision(): number
  • Gets or sets precision on interpolated values of crosshairs on x-axis.

    Returns number

  • set crosshairsAnnotationXAxisPrecision(v): void
  • Parameters

    • v: number

    Returns void

  • get crosshairsAnnotationXAxisTextColor(): string
  • Gets or sets the text color of crosshair annotation on x-axis.

    Returns string

  • set crosshairsAnnotationXAxisTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get crosshairsAnnotationYAxisBackground(): string
  • Gets or sets the background of crosshair annotation on y-axis.

    Returns string

  • set crosshairsAnnotationYAxisBackground(v): void
  • Parameters

    • v: string

    Returns void

  • get crosshairsAnnotationYAxisPrecision(): number
  • Gets or sets precision on interpolated values of crosshairs on y-axis.

    Returns number

  • set crosshairsAnnotationYAxisPrecision(v): void
  • Parameters

    • v: number

    Returns void

  • get crosshairsAnnotationYAxisTextColor(): string
  • Gets or sets the text color of crosshair annotation on y-axis.

    Returns string

  • set crosshairsAnnotationYAxisTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get crosshairsDisplayMode(): CrosshairsDisplayMode
  • Gets or sets the crosshairs to be displayed.

    Returns CrosshairsDisplayMode

  • set crosshairsDisplayMode(v): void
  • Parameters

    Returns void

  • get crosshairsLineHorizontalStroke(): string
  • Gets or sets the color to apply to horizontal crosshairs line.

    Returns string

  • set crosshairsLineHorizontalStroke(v): void
  • Parameters

    • v: string

    Returns void

  • get crosshairsLineThickness(): number
  • Gets or sets thickness of crosshairs lines.

    Returns number

  • set crosshairsLineThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get crosshairsLineVerticalStroke(): string
  • Gets or sets the color to apply to vertical crosshairs line.

    Returns string

  • set crosshairsLineVerticalStroke(v): void
  • Parameters

    • v: string

    Returns void

  • get crosshairsSnapToData(): boolean
  • Gets or sets whether crosshairs will snap to the nearest data point.

    Returns boolean

  • set crosshairsSnapToData(v): void
  • Parameters

    • v: boolean

    Returns void

  • get customIndicatorNames(): IgrCustomIndicatorNameCollection
  • The names of custom indicators to add to the chart. When CustomIndicatorNames is set, the ApplyCustomIndicators event will be raised for each custom indicator name.

    Returns IgrCustomIndicatorNameCollection

  • set customIndicatorNames(v): void
  • Parameters

    Returns void

  • get dataSource(): any[]
  • Returns any[]

  • set dataSource(value): void
  • Parameters

    • value: any[]

    Returns void

  • get dataToolTipBadgeMarginBottom(): number
  • Returns number

  • set dataToolTipBadgeMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipBadgeMarginLeft(): number
  • Returns number

  • set dataToolTipBadgeMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipBadgeMarginRight(): number
  • Returns number

  • set dataToolTipBadgeMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipBadgeMarginTop(): number
  • Returns number

  • set dataToolTipBadgeMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipBadgeShape(): LegendItemBadgeShape
  • Gets or sets the BadgeShape for the data legend.

    Returns LegendItemBadgeShape

  • set dataToolTipBadgeShape(v): void
  • Parameters

    • v: LegendItemBadgeShape

    Returns void

  • get dataToolTipDefaultPositionOffsetX(): number
  • Gets or sets the offset of the tooltip layer on the X axis.

    Returns number

  • set dataToolTipDefaultPositionOffsetX(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipDefaultPositionOffsetY(): number
  • Gets or sets the offset of the tooltip layer on the Y axis.

    Returns number

  • set dataToolTipDefaultPositionOffsetY(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipExcludedColumns(): string[]
  • Gets or sets names of data columns or their labels to exclude from displaying in the data legend, e.g. "High, Low" or "H, L" The DataToolTipExcludedColumns property takes precedence over values of DataToolTipIncludedColumns property

    Returns string[]

  • set dataToolTipExcludedColumns(v): void
  • Parameters

    • v: string[]

    Returns void

  • get dataToolTipExcludedSeries(): string[]
  • Gets or sets indexes, titles, or names of series to exclude from displaying in the data tooltip, e.g. "0, 1" or "Series1 Title, Series2 Title" The DataToolTipExcludedSeries property takes precedence over values of DataToolTipIncludedSeries property

    Returns string[]

  • set dataToolTipExcludedSeries(v): void
  • Parameters

    • v: string[]

    Returns void

  • get dataToolTipGroupRowMarginBottom(): number
  • Returns number

  • set dataToolTipGroupRowMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupRowMarginLeft(): number
  • Returns number

  • set dataToolTipGroupRowMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupRowMarginRight(): number
  • Returns number

  • set dataToolTipGroupRowMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupRowMarginTop(): number
  • Returns number

  • set dataToolTipGroupRowMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupRowVisible(): boolean
  • Gets or sets whether to show Group row.

    Returns boolean

  • set dataToolTipGroupRowVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get dataToolTipGroupTextColor(): string
  • Gets or sets the Group text color.

    Returns string

  • set dataToolTipGroupTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipGroupTextMarginBottom(): number
  • Returns number

  • set dataToolTipGroupTextMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupTextMarginLeft(): number
  • Returns number

  • set dataToolTipGroupTextMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupTextMarginRight(): number
  • Returns number

  • set dataToolTipGroupTextMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupTextMarginTop(): number
  • Returns number

  • set dataToolTipGroupTextMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipGroupTextStyle(): string
  • Gets or Sets the style to use for the Group text.

    Returns string

  • set dataToolTipGroupTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipGroupedPositionModeX(): DataTooltipGroupedPositionX
  • Gets or sets the tooltip position mode on the X axis for grouped series.

    Returns DataTooltipGroupedPositionX

  • set dataToolTipGroupedPositionModeX(v): void
  • Parameters

    • v: DataTooltipGroupedPositionX

    Returns void

  • get dataToolTipGroupedPositionModeY(): DataTooltipGroupedPositionY
  • Gets or sets the tooltip position mode on the Y axis for grouped series.

    Returns DataTooltipGroupedPositionY

  • set dataToolTipGroupedPositionModeY(v): void
  • Parameters

    • v: DataTooltipGroupedPositionY

    Returns void

  • get dataToolTipGroupingMode(): DataToolTipLayerGroupingMode
  • Returns DataToolTipLayerGroupingMode

  • set dataToolTipGroupingMode(v): void
  • Parameters

    • v: DataToolTipLayerGroupingMode

    Returns void

  • get dataToolTipHeaderFormatCulture(): string
  • Gets or sets globalization culture when displaying header as date time This property is ignored when setting HeaderFormatSpecifiers or HeaderFormatString properties

    Returns string

  • set dataToolTipHeaderFormatCulture(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipHeaderFormatDate(): DataLegendHeaderDateMode
  • Gets or sets date format for the header This property is ignored when setting HeaderFormatSpecifiers or HeaderFormatString properties

    Returns DataLegendHeaderDateMode

  • set dataToolTipHeaderFormatDate(v): void
  • Parameters

    • v: DataLegendHeaderDateMode

    Returns void

  • get dataToolTipHeaderFormatSpecifiers(): any[]
  • Gets or sets the format specifiers to use with the HeaderFormatString string.

    Returns any[]

  • set dataToolTipHeaderFormatSpecifiers(v): void
  • Parameters

    • v: any[]

    Returns void

  • get dataToolTipHeaderFormatString(): string
  • Gets or sets the format string for header text displayed in the data legend.

    Returns string

  • set dataToolTipHeaderFormatString(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipHeaderFormatTime(): DataLegendHeaderTimeMode
  • Gets or sets time format for the header This property is ignored when setting HeaderFormatSpecifiers or HeaderFormatString properties

    Returns DataLegendHeaderTimeMode

  • set dataToolTipHeaderFormatTime(v): void
  • Parameters

    • v: DataLegendHeaderTimeMode

    Returns void

  • get dataToolTipHeaderRowMarginBottom(): number
  • Returns number

  • set dataToolTipHeaderRowMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderRowMarginLeft(): number
  • Returns number

  • set dataToolTipHeaderRowMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderRowMarginRight(): number
  • Returns number

  • set dataToolTipHeaderRowMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderRowMarginTop(): number
  • Returns number

  • set dataToolTipHeaderRowMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderRowVisible(): boolean
  • Gets or sets whether to show Header row.

    Returns boolean

  • set dataToolTipHeaderRowVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get dataToolTipHeaderText(): string
  • Gets or sets the HeaderText for the data legend.

    Returns string

  • set dataToolTipHeaderText(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipHeaderTextColor(): string
  • Gets or sets the header text color.

    Returns string

  • set dataToolTipHeaderTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipHeaderTextMarginBottom(): number
  • Returns number

  • set dataToolTipHeaderTextMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderTextMarginLeft(): number
  • Returns number

  • set dataToolTipHeaderTextMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderTextMarginRight(): number
  • Returns number

  • set dataToolTipHeaderTextMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderTextMarginTop(): number
  • Returns number

  • set dataToolTipHeaderTextMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipHeaderTextStyle(): string
  • Gets or Sets the style to use for the header text.

    Returns string

  • set dataToolTipHeaderTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipIncludedColumns(): string[]
  • Gets or sets names of data columns or their labels to include in displaying in the data legend, e.g. "High, Low" or "H, L" The DataToolTipExcludedColumns property takes precedence over values of DataToolTipIncludedColumns property

    Returns string[]

  • set dataToolTipIncludedColumns(v): void
  • Parameters

    • v: string[]

    Returns void

  • get dataToolTipIncludedSeries(): string[]
  • Gets or sets indexes, titles, or names of series to include in displaying in the data tooltip, e.g. "0, 1" or "Series1 Title, Series2 Title" The DataToolTipExcludedSeries property takes precedence over values of DataToolTipIncludedSeries property

    Returns string[]

  • set dataToolTipIncludedSeries(v): void
  • Parameters

    • v: string[]

    Returns void

  • get dataToolTipLabelDisplayMode(): DataLegendLabelMode
  • Gets or sets the mode for displaying labels before series values in the data legend, e.g. O: H: L: C: for financial series

    Returns DataLegendLabelMode

  • set dataToolTipLabelDisplayMode(v): void
  • Parameters

    • v: DataLegendLabelMode

    Returns void

  • get dataToolTipLabelTextColor(): string
  • Gets or sets the units text color.

    Returns string

  • set dataToolTipLabelTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipLabelTextMarginBottom(): number
  • Returns number

  • set dataToolTipLabelTextMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipLabelTextMarginLeft(): number
  • Returns number

  • set dataToolTipLabelTextMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipLabelTextMarginRight(): number
  • Returns number

  • set dataToolTipLabelTextMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipLabelTextMarginTop(): number
  • Returns number

  • set dataToolTipLabelTextMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipLabelTextStyle(): string
  • Gets or Sets the style to use for the units text.

    Returns string

  • set dataToolTipLabelTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipPositionOffsetX(): number
  • Gets or sets the offset of the tooltip layer on the X axis.

    Returns number

  • set dataToolTipPositionOffsetX(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipPositionOffsetY(): number
  • Gets or sets the offset of the tooltip layer on the Y axis.

    Returns number

  • set dataToolTipPositionOffsetY(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipShouldUpdateWhenSeriesDataChanges(): boolean
  • Gets or sets whether the data legend should update when the series data is mutated.

    Returns boolean

  • set dataToolTipShouldUpdateWhenSeriesDataChanges(v): void
  • Parameters

    • v: boolean

    Returns void

  • get dataToolTipSummaryLabelText(): string
  • Gets or sets the units text for the data legend.

    Returns string

  • set dataToolTipSummaryLabelText(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryLabelTextColor(): string
  • Gets or sets the units text color.

    Returns string

  • set dataToolTipSummaryLabelTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryLabelTextStyle(): string
  • Gets or Sets the style to use for the units text.

    Returns string

  • set dataToolTipSummaryLabelTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryRowMarginBottom(): number
  • Returns number

  • set dataToolTipSummaryRowMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryRowMarginLeft(): number
  • Returns number

  • set dataToolTipSummaryRowMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryRowMarginRight(): number
  • Returns number

  • set dataToolTipSummaryRowMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryRowMarginTop(): number
  • Returns number

  • set dataToolTipSummaryRowMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryTitleText(): string
  • Gets or sets the SummaryTitleText for the data legend.

    Returns string

  • set dataToolTipSummaryTitleText(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryTitleTextColor(): string
  • Gets or sets the summary text color.

    Returns string

  • set dataToolTipSummaryTitleTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryTitleTextMarginBottom(): number
  • Returns number

  • set dataToolTipSummaryTitleTextMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryTitleTextMarginLeft(): number
  • Returns number

  • set dataToolTipSummaryTitleTextMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryTitleTextMarginRight(): number
  • Returns number

  • set dataToolTipSummaryTitleTextMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryTitleTextMarginTop(): number
  • Returns number

  • set dataToolTipSummaryTitleTextMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipSummaryTitleTextStyle(): string
  • Gets or Sets the style to use for the summary text.

    Returns string

  • set dataToolTipSummaryTitleTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryType(): DataLegendSummaryType
  • Gets or sets the SummaryType for the data legend.

    Returns DataLegendSummaryType

  • set dataToolTipSummaryType(v): void
  • Parameters

    • v: DataLegendSummaryType

    Returns void

  • get dataToolTipSummaryUnitsText(): string
  • Gets or sets the units text for the data legend.

    Returns string

  • set dataToolTipSummaryUnitsText(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryUnitsTextColor(): string
  • Gets or sets the units text color.

    Returns string

  • set dataToolTipSummaryUnitsTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryUnitsTextStyle(): string
  • Gets or Sets the style to use for the units text.

    Returns string

  • set dataToolTipSummaryUnitsTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryValueTextColor(): string
  • Gets or sets the units text color.

    Returns string

  • set dataToolTipSummaryValueTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipSummaryValueTextStyle(): string
  • Gets or Sets the style to use for the units text.

    Returns string

  • set dataToolTipSummaryValueTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipTitleTextColor(): string
  • Gets or sets the display text color.

    Returns string

  • set dataToolTipTitleTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipTitleTextMarginBottom(): number
  • Returns number

  • set dataToolTipTitleTextMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipTitleTextMarginLeft(): number
  • Returns number

  • set dataToolTipTitleTextMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipTitleTextMarginRight(): number
  • Returns number

  • set dataToolTipTitleTextMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipTitleTextMarginTop(): number
  • Returns number

  • set dataToolTipTitleTextMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipTitleTextStyle(): string
  • Gets or Sets the style to use for the display text.

    Returns string

  • set dataToolTipTitleTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipUnitsDisplayMode(): DataLegendUnitsMode
  • Gets or sets the UnitsMode for the data legend.

    Returns DataLegendUnitsMode

  • set dataToolTipUnitsDisplayMode(v): void
  • Parameters

    • v: DataLegendUnitsMode

    Returns void

  • get dataToolTipUnitsText(): string
  • Gets or sets the units text for the data legend.

    Returns string

  • set dataToolTipUnitsText(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipUnitsTextColor(): string
  • Gets or sets the units text color.

    Returns string

  • set dataToolTipUnitsTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipUnitsTextMarginBottom(): number
  • Returns number

  • set dataToolTipUnitsTextMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipUnitsTextMarginLeft(): number
  • Returns number

  • set dataToolTipUnitsTextMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipUnitsTextMarginRight(): number
  • Returns number

  • set dataToolTipUnitsTextMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipUnitsTextMarginTop(): number
  • Returns number

  • set dataToolTipUnitsTextMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipUnitsTextStyle(): string
  • Gets or Sets the style to use for the units text.

    Returns string

  • set dataToolTipUnitsTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipValueFormatAbbreviation(): DataAbbreviationMode
  • Gets or sets mode for abbreviating large numbers displayed in the legend This property is ignored when setting ValueFormatSpecifiers or ValueFormatString properties

    Returns DataAbbreviationMode

  • set dataToolTipValueFormatAbbreviation(v): void
  • Parameters

    • v: DataAbbreviationMode

    Returns void

  • get dataToolTipValueFormatCulture(): string
  • Gets or sets globalization culture when displaying values as currencies, e.g. use "en-GB" to display British pound symbol when the ValueFormatMode property is set to 'Currency' mode This property is ignored when setting ValueFormatSpecifiers or ValueFormatString properties

    Returns string

  • set dataToolTipValueFormatCulture(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipValueFormatMaxFractions(): number
  • Gets or sets maximum digits for formatting numbers displayed in the legend This property is ignored when setting ValueFormatSpecifiers or ValueFormatString properties

    Returns number

  • set dataToolTipValueFormatMaxFractions(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueFormatMinFractions(): number
  • Gets or sets minimum digits for formatting numbers displayed in the legend This property is ignored when setting ValueFormatSpecifiers or ValueFormatString properties

    Returns number

  • set dataToolTipValueFormatMinFractions(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueFormatMode(): DataLegendValueMode
  • Gets or sets the mode for displaying values in the data legend, e.g. Currency ($500.25), Decimal (500.25), Integer (500)

    Returns DataLegendValueMode

  • set dataToolTipValueFormatMode(v): void
  • Parameters

    • v: DataLegendValueMode

    Returns void

  • get dataToolTipValueFormatSpecifiers(): any[]
  • Gets or sets the format specifiers to use with the ValueFormatString string.

    Returns any[]

  • set dataToolTipValueFormatSpecifiers(v): void
  • Parameters

    • v: any[]

    Returns void

  • get dataToolTipValueFormatString(): string
  • Gets or sets the format string for values displayed in the data legend.

    Returns string

  • set dataToolTipValueFormatString(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipValueFormatUseGrouping(): boolean
  • Gets or sets whether or not use grouping separator, e.g, 15,000 for 15000 This property is ignored when setting ValueFormatSpecifiers or ValueFormatString properties

    Returns boolean

  • set dataToolTipValueFormatUseGrouping(v): void
  • Parameters

    • v: boolean

    Returns void

  • get dataToolTipValueRowMarginBottom(): number
  • Returns number

  • set dataToolTipValueRowMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueRowMarginLeft(): number
  • Returns number

  • set dataToolTipValueRowMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueRowMarginRight(): number
  • Returns number

  • set dataToolTipValueRowMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueRowMarginTop(): number
  • Returns number

  • set dataToolTipValueRowMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueRowVisible(): boolean
  • Gets or sets whether to show series rows.

    Returns boolean

  • set dataToolTipValueRowVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get dataToolTipValueTextColor(): string
  • Gets or sets the units text color.

    Returns string

  • set dataToolTipValueTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipValueTextMarginBottom(): number
  • Returns number

  • set dataToolTipValueTextMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueTextMarginLeft(): number
  • Returns number

  • set dataToolTipValueTextMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueTextMarginRight(): number
  • Returns number

  • set dataToolTipValueTextMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueTextMarginTop(): number
  • Returns number

  • set dataToolTipValueTextMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get dataToolTipValueTextStyle(): string
  • Gets or Sets the style to use for the units text.

    Returns string

  • set dataToolTipValueTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get dataToolTipValueTextUseSeriesColors(): boolean
  • Gets or sets whether to use series colors when displaying values in the legend

    Returns boolean

  • set dataToolTipValueTextUseSeriesColors(v): void
  • Parameters

    • v: boolean

    Returns void

  • get dataToolTipValueTextWhenMissingData(): string
  • Gets or sets text displayed when data column is missing a value, e.g. "no data"

    Returns string

  • set dataToolTipValueTextWhenMissingData(v): void
  • Parameters

    • v: string

    Returns void

  • get domainType(): DomainType
  • Gets domain type of this chart

    Returns DomainType

  • get excludedProperties(): string[]
  • Gets or sets a set of property paths that should be excluded from consideration by the category chart.

    The ExcludedProperties property used for the property paths that should be excluded from consideration by the category chart.

    this.chart.excludedProperties = ["ID", "Discount"];
    
        <IgrCategoryChart
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    excludedProperties="value" />

    Returns string[]

  • set excludedProperties(v): void
  • Parameters

    • v: string[]

    Returns void

  • get filterExpressions(): IgrFilterExpressionCollection
  • Gets the current filter that is applied to the chart. Collection can be updated to modify the filter for the chart. Once filter expressions are in this collection, the chart will no longer listen for changes on their properties.

    Returns IgrFilterExpressionCollection

  • get finalValueAnnotationsBackground(): string
  • Gets or sets the background of final value annotation.

    Returns string

  • set finalValueAnnotationsBackground(v): void
  • Parameters

    • v: string

    Returns void

  • get finalValueAnnotationsPrecision(): number
  • Gets or sets precision on final value annotation.

    Returns number

  • set finalValueAnnotationsPrecision(v): void
  • Parameters

    • v: number

    Returns void

  • get finalValueAnnotationsTextColor(): string
  • Gets or sets the text color of final value annotation.

    Returns string

  • set finalValueAnnotationsTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get finalValueAnnotationsVisible(): boolean
  • Gets or sets whether annotations for the final value of each series is displayed on the axis.

    Returns boolean

  • set finalValueAnnotationsVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get focusBrush(): string
  • Gets or sets the focus brush to use for the series.

    Returns string

  • set focusBrush(v): void
  • Parameters

    • v: string

    Returns void

  • get focusMode(): SeriesSelectionMode
  • Gets or sets the focus mode to use for the series in the component, when supported.

    Returns SeriesSelectionMode

  • set focusMode(v): void
  • Parameters

    Returns void

  • get focusedSeriesItems(): IgrChartSelectedItemCollection
  • Gets the currently focused data items. Adding or removing data items from this collection will focus or blur the visuals associated with those items.

    Returns IgrChartSelectedItemCollection

  • set focusedSeriesItems(v): void
  • Parameters

    Returns void

  • get groupDescriptions(): IgrChartSortDescriptionCollection
  • Gets the current grouping that is applied to the grid. Collection can be updated to modify the grouping for the grid. Once grouping descriptions are in this collection, the grid will no longer listen for changes on their properties.

    Returns IgrChartSortDescriptionCollection

  • get groupSorts(): string
  • Gets or sets the sorts to apply after grouping has been applied.

    Returns string

  • set groupSorts(v): void
  • Parameters

    • v: string

    Returns void

  • get height(): string
  • Returns string

  • set height(value): void
  • Parameters

    • value: string

    Returns void

  • get highlightFilterExpressions(): IgrFilterExpressionCollection
  • Gets the current highlight filter that is applied to the chart. Collection can be updated to modify the highlight filter for the chart. Once filter expressions are in this collection, the chart will no longer listen for changes on their properties.

    Returns IgrFilterExpressionCollection

  • get highlightedValuesDisplayMode(): SeriesHighlightedValuesDisplayMode
  • Gets or sets whether and how to display highlighted values for the series. Note, this is distinct from the highlighting feature that indicates what is closest or under the mouse. This property applies to Category Chart and Financial Chart controls.

    Returns SeriesHighlightedValuesDisplayMode

  • set highlightedValuesDisplayMode(v): void
  • Parameters

    Returns void

  • get highlightingBehavior(): SeriesHighlightingBehavior
  • Gets or sets the highlighting Behavior to use for the series in the component, when supported. This takes precedence over the series level IsHighlightingEnabled.

    Returns SeriesHighlightingBehavior

  • set highlightingBehavior(v): void
  • Parameters

    Returns void

  • get highlightingMode(): SeriesHighlightingMode
  • Gets or sets the highlighting mode to use for the series in the component, when supported. This takes precedence over the series level IsHighlightingEnabled.

    Returns SeriesHighlightingMode

  • set highlightingMode(v): void
  • Parameters

    Returns void

  • get horizontalViewScrollbarCornerRadius(): number
  • Gets or sets the corner radius to use for the horizontal scrollbar in the component, when enabled.

    Returns number

  • set horizontalViewScrollbarCornerRadius(v): void
  • Parameters

    • v: number

    Returns void

  • get horizontalViewScrollbarFill(): string
  • Gets or sets the fill to use for the horizontal scrollbar in the component, when enabled.

    Returns string

  • set horizontalViewScrollbarFill(v): void
  • Parameters

    • v: string

    Returns void

  • get horizontalViewScrollbarHeight(): number
  • Gets or sets the height to use for the horizontal scrollbar in the component, when enabled.

    Returns number

  • set horizontalViewScrollbarHeight(v): void
  • Parameters

    • v: number

    Returns void

  • get horizontalViewScrollbarInset(): number
  • Gets or sets the inset distance to use for the horizontal scrollbar in the component, when enabled.

    Returns number

  • set horizontalViewScrollbarInset(v): void
  • Parameters

    • v: number

    Returns void

  • get horizontalViewScrollbarMaxOpacity(): number
  • Gets or sets the max opacity to use for the horizontal scrollbar in the component, when enabled.

    Returns number

  • set horizontalViewScrollbarMaxOpacity(v): void
  • Parameters

    • v: number

    Returns void

  • get horizontalViewScrollbarMode(): SeriesViewerScrollbarMode
  • Gets or sets the horizontal scrollbar mode to use for the series viewer.

    Returns SeriesViewerScrollbarMode

  • set horizontalViewScrollbarMode(v): void
  • Parameters

    Returns void

  • get horizontalViewScrollbarOutline(): string
  • Gets or sets the outline to use for the horizontal scrollbar in the component, when enabled.

    Returns string

  • set horizontalViewScrollbarOutline(v): void
  • Parameters

    • v: string

    Returns void

  • get horizontalViewScrollbarShouldAddAutoTrackInsets(): boolean
  • Gets or sets whether to use automatic track insets for the horizontal scrollbar in the component, when enabled.

    Returns boolean

  • set horizontalViewScrollbarShouldAddAutoTrackInsets(v): void
  • Parameters

    • v: boolean

    Returns void

  • get horizontalViewScrollbarStrokeThickness(): number
  • Gets or sets the stroke thickness to use for the horizontal scrollbar in the component, when enabled.

    Returns number

  • set horizontalViewScrollbarStrokeThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get horizontalViewScrollbarTrackEndInset(): number
  • Gets or sets the track end inset to use for the horizontal scrollbar in the component, when enabled.

    Returns number

  • set horizontalViewScrollbarTrackEndInset(v): void
  • Parameters

    • v: number

    Returns void

  • get horizontalViewScrollbarTrackStartInset(): number
  • Gets or sets the track start inset to use for the horizontal scrollbar in the component, when enabled.

    Returns number

  • set horizontalViewScrollbarTrackStartInset(v): void
  • Parameters

    • v: number

    Returns void

  • get i(): FinancialChart
  • Returns FinancialChart

  • get includedProperties(): string[]
  • Gets or sets a set of property paths that should be included for consideration by the category chart, leaving the remainder excluded. If null, all properties will be considered.

    The IncludedProperties property used to include the properties for the consideration of the category chart.

    this.chart.includedProperties = ["ProductName", "Cost"];
    
        <IgrCategoryChart
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    excludedProperties="value" />

    Returns string[]

  • set includedProperties(v): void
  • Parameters

    • v: string[]

    Returns void

  • get indicatorBrushes(): string[]
  • Brushes to use for financial indicators.

    Use the IndicatorBrushes property to set a collection of brushes that will be used to render positive elements of indicators in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorBrushes="Green" />

    Returns string[]

  • set indicatorBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get indicatorDisplayTypes(): IgrIndicatorDisplayTypeCollection
  • The display types of financial indicators.

    Use the IndicatorDisplayTypes property to set display types that will determine whether render all indicators as area, lines, or columns in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorDisplayTypes="line" />

    Returns IgrIndicatorDisplayTypeCollection

  • set indicatorDisplayTypes(v): void
  • Parameters

    Returns void

  • get indicatorLongPeriod(): number
  • The long period of financial indicators, where applicable.

    The IndicatorLongPeriod property applies only to these indicator types:

    • AbsoluteVolumeOscillator,
    • ChaikinOscillator,
    • MovingAverageConvergenceDivergence,
    • PercentagePriceOscillator,
    • PercentageVolumeOscillator,
    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorLongPeriod={8} />

    Returns number

  • set indicatorLongPeriod(v): void
  • Parameters

    • v: number

    Returns void

  • get indicatorMenuTemplate(): any
  • Returns any

  • set indicatorMenuTemplate(value): void
  • Parameters

    • value: any

    Returns void

  • get indicatorMultiplier(): number
  • The multiplier of financial indicators, e.g. BollingerBandWidth indicator.

    The IndicatorMultiplier property applies to only to BollingerBandWidth indicator type.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorMultiplier= {8} />

    Returns number

  • set indicatorMultiplier(v): void
  • Parameters

    • v: number

    Returns void

  • get indicatorNegativeBrushes(): string[]
  • Brushes to use for negative elements in financial indicators.

    Use the IndicatorNegativeBrushes property to set a collection of brushes that will be used to render negative elements of indicators in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorNegativeBrushes="Red"/>

    Returns string[]

  • set indicatorNegativeBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get indicatorPeriod(): number
  • The period of financial indicators, where applicable.

    The indicatorPeriod property applies to only the BollingerBands overlay as well as to these indicators types: AverageDirectionalIndex, AverageTrueRange, BollingerBandWidth, ChaikinVolatility, CommodityChannelIndex, DetrendedPriceOscillator, FastStochasticOscillator, ForceIndex, FullStochasticOscillator, MoneyFlowIndex, PriceChannelOverlay, RateOfChangeAndMomentum, RelativeStrengthIndex, SlowStochasticOscillator, StandardDeviation, StochRSI, TRIX, WilliamsPercentR

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorPeriod={8} />

    Returns number

  • set indicatorPeriod(v): void
  • Parameters

    • v: number

    Returns void

  • get indicatorShortPeriod(): number
  • The short period of financial indicators, where applicable.

    The IndicatorShortPeriod property applies only to these indicator types:

    • AbsoluteVolumeOscillator,
    • ChaikinOscillator,
    • MovingAverageConvergenceDivergence,
    • PercentagePriceOscillator,
    • PercentageVolumeOscillator,
    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorShortPeriod={8} />

    Returns number

  • set indicatorShortPeriod(v): void
  • Parameters

    • v: number

    Returns void

  • get indicatorSignalPeriod(): number
  • The signal period of financial indicators, where applicable.

    The IndicatorSignalPeriod property applies to only to MovingAverageConvergenceDivergence indicator type.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorSignalPeriod ={8} />

    Returns number

  • set indicatorSignalPeriod(v): void
  • Parameters

    • v: number

    Returns void

  • get indicatorSmoothingPeriod(): number
  • The smoothing period of financial indicators, where applicable.

    The IndicatorSmoothingPeriod property applies to only to FullStochasticOscillator indicator type.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorSmoothingPeriod={8} />

    Returns number

  • set indicatorSmoothingPeriod(v): void
  • Parameters

    • v: number

    Returns void

  • get indicatorThickness(): number
  • The outline or stroke thickness of financial indicators.

    Use the IndicatorThickness property to set a number that will be used to render outline thickness of all indicators in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorThickness={2.5} />

    Returns number

  • set indicatorThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get indicatorTypes(): IgrFinancialIndicatorTypeCollection
  • A collection indicating what financial indicator types to display on the Financial Chart.

    Use the IndicatorTypes property to set types of indicators that will be rendered below the price pane in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    indicatorTypes="ForceIndex" />

    Returns IgrFinancialIndicatorTypeCollection

  • set indicatorTypes(v): void
  • Parameters

    Returns void

  • get initialFilter(): string
  • Gets or sets the filter to apply to the chart. This property will become ignored if the filter is changed outside of this property.

    Returns string

  • set initialFilter(v): void
  • Parameters

    • v: string

    Returns void

  • get initialFilterExpressions(): IgrFilterExpressionCollection
  • Gets the initial filters that are applied to the chart.

    Returns IgrFilterExpressionCollection

  • get initialGroups(): string
  • Gets or sets the groupings to apply to the chart. This property will become ignored if sorts are changed outside of this property.

    Returns string

  • set initialGroups(v): void
  • Parameters

    • v: string

    Returns void

  • get initialHighlightFilter(): string
  • Gets or sets the filter to apply to the chart. This property will become ignored if the filter is changed outside of this property.

    Returns string

  • set initialHighlightFilter(v): void
  • Parameters

    • v: string

    Returns void

  • get initialHighlightFilterExpressions(): IgrFilterExpressionCollection
  • Gets the initial highlight filters that are applied to the chart.

    Returns IgrFilterExpressionCollection

  • get initialSorts(): string
  • Gets or sets the sorts to apply to the chart. This property will become ignored if sorts are changed outside of this property.

    Returns string

  • set initialSorts(v): void
  • Parameters

    • v: string

    Returns void

  • get initialSummaries(): string
  • Gets or sets the summaries to apply to the chart. This property will become ignored if sorts are changed outside of this property.

    Returns string

  • set initialSummaries(v): void
  • Parameters

    • v: string

    Returns void

  • get isDetached(): boolean
  • Returns boolean

  • get isHorizontalZoomEnabled(): boolean
  • Gets or sets whether the chart can be horizontally zoomed through user interactions.

    Use the IsHorizontalZoomEnabled property to allow chart horizontally zoomed .

     <IgrCategoryChart dataSource={this.state.data}
    width="700px"
    height="500px"
    xAxisLabelTextStyle="10pt Verdana"
    xAxisLabelTopMargin={5}
    xAxisLabelTextColor="gray"
    yAxisLabelTextStyle="10pt Verdana"
    yAxisLabelRightMargin={5}
    yAxisLabelTextColor="gray"
    isHorizontalZoomEnabled= true/>
     <IgrCategoryChart dataSource={this.state.data}
    IsHorizontalZoomEnabled= true />
    this.chart.isHorizontalZoomEnabled = true;
    

    Returns boolean

  • set isHorizontalZoomEnabled(v): void
  • Parameters

    • v: boolean

    Returns void

  • get isLegendVisible(): boolean
  • Gets or sets weather or not a legend is visible between toolbar and chart's plot area

    Returns boolean

  • set isLegendVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get isSeriesHighlightingEnabled(): boolean
  • Gets or sets whether the chart can highlight series through user interactions. This property applies to Category Chart and Financial Chart controls.

    Returns boolean

  • set isSeriesHighlightingEnabled(v): void
  • Parameters

    • v: boolean

    Returns void

  • get isToolbarVisible(): boolean
  • A boolean property controlling the visibility of the toolbar.

    Returns boolean

  • set isToolbarVisible(v): void
  • Parameters

    • v: boolean

    Returns void

  • get isVerticalZoomEnabled(): boolean
  • Gets or sets whether the chart can be vertically zoomed through user interactions.

    Use the IsVerticalZoomEnabled property to allow chart zoom vertically.

     this.chart.isVerticalZoomEnabled = true;
    
     <IgrCategoryChart dataSource={this.state.data}
    isVerticalZoomEnabled= "true"/>

    Returns boolean

  • set isVerticalZoomEnabled(v): void
  • Parameters

    • v: boolean

    Returns void

  • get isWindowSyncedToVisibleRange(): boolean
  • A boolean indicating whether the chart should automatically zoom in vertically on the currently visible range of data. When this property is set to true, panning and zooming along the X-axis will result in a corresponding zoom on the Y-axis, so that the visible range of data fills the zoom window as fully as possible.

    Returns boolean

  • set isWindowSyncedToVisibleRange(v): void
  • Parameters

    • v: boolean

    Returns void

  • get leftMargin(): number
  • Gets or sets the left margin of the chart content.

    Use the 'leftMargin' property for the left margin of the chart content.

     this.chart.leftMargin = 20;
    
     <IgrCategoryChart dataSource={this.state.data}
    leftMargin= {20}/>

    Returns number

  • set leftMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get legend(): any
  • Returns any

  • set legend(v): void
  • Parameters

    • v: any

    Returns void

  • get legendHighlightingMode(): LegendHighlightingMode
  • Gets or sets the highlighting mode to use for the legend linked to the component, when supported.

    Returns LegendHighlightingMode

  • set legendHighlightingMode(v): void
  • Parameters

    Returns void

  • get legendItemBadgeMode(): LegendItemBadgeMode
  • Gets or sets the mode of legend badges representing all series displayed in a legend linked to this component. This property will be ignored when the LegendItemTemplate or LegendItemBadgeTemplate property is set on a series

    Returns LegendItemBadgeMode

  • set legendItemBadgeMode(v): void
  • Parameters

    • v: LegendItemBadgeMode

    Returns void

  • get legendItemBadgeShape(): LegendItemBadgeShape
  • Gets or sets the type of legend badges representing all series displayed in a legend linked to this component This property will be ignored when the LegendItemTemplate or LegendItemBadgeTemplate property is set on a series

    Returns LegendItemBadgeShape

  • set legendItemBadgeShape(v): void
  • Parameters

    • v: LegendItemBadgeShape

    Returns void

  • get markerAutomaticBehavior(): MarkerAutomaticBehavior
  • Gets or sets the default marker type for all series plotted in this chart. This property is ignored when the MarkerTypes property is set

    Returns MarkerAutomaticBehavior

  • set markerAutomaticBehavior(v): void
  • Parameters

    Returns void

  • get markerBrushes(): string[]
  • Gets or sets the palette of brushes used for rendering fill area of data point markers. This property applies only to these chart types: point, line, spline, bubble, and polygon

    MarkerBrushes property used for rendering fill area of data point markers.

     this.chart.markerBrushes=[ "#ff0000", "#ffff00", "#00ffff" ];
    
    <IgrCategoryChart
    chartType="Line"
    markerBrushes ="#ffff00"
    dataSource={this.categoryData}/>

    Returns string[]

  • set markerBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get markerFillMode(): MarkerFillMode
  • Gets or sets the MarkerFillMode for all series that support markers in this chart.

    Returns MarkerFillMode

  • set markerFillMode(v): void
  • Parameters

    Returns void

  • get markerFillOpacity(): number
  • Gets or sets the Marker Fill Opacity for all series that support markers in this chart.

    Returns number

  • set markerFillOpacity(v): void
  • Parameters

    • v: number

    Returns void

  • get markerMaxCount(): number
  • Gets or sets the maximum number of markers displayed in the plot area of the chart.

    markerMaxCount property used to display maximum number of markers in the plot area of the chart.

     this.chart.markerMaxCount = 100 ;
    
    <IgrCategoryChart
    chartType="Line"
    markerMaxCount= {2}
    dataSource={this.categoryData}/>

    Returns number

  • set markerMaxCount(v): void
  • Parameters

    • v: number

    Returns void

  • get markerOutlineMode(): MarkerOutlineMode
  • Gets or sets the MarkerOutlineMode for all series that support markers in this chart.

    Returns MarkerOutlineMode

  • set markerOutlineMode(v): void
  • Parameters

    Returns void

  • get markerOutlines(): string[]
  • Gets or sets the palette of brushes used for rendering outlines of data point markers. This property applies only to these chart types: point, line, spline, bubble, and polygon

    MarkerOutlines property used for rendering outlines of data point markers.

    this.chart.markerOutlines= ["#ff0000", "#ffff00", "#00ffff"] ;
    
    <IgrCategoryChart
    chartType="Line"
    markerOutlines= "#ff0000"
    dataSource={this.categoryData}/>

    Returns string[]

  • set markerOutlines(v): void
  • Parameters

    • v: string[]

    Returns void

  • get markerThickness(): number
  • Gets or sets the Marker Thickness for all series that support markers in this chart.

    Returns number

  • set markerThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get markerTypes(): IgrMarkerTypeCollection
  • Gets or sets the marker shapes used for indicating location of data points in this chart. This property applies only to these chart types: point, line, spline, bubble, and polygon

    Returns IgrMarkerTypeCollection

  • set markerTypes(v): void
  • Parameters

    Returns void

  • get negativeBrushes(): string[]
  • Gets or sets the palette used for coloring negative items of Waterfall chart type.

    Use the NegativeBrushes property to set a collection of brushes that will be used to render fill area of negative elements in the price pane, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    negativeBrushes="Red" />

    Returns string[]

  • set negativeBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get negativeOutlines(): string[]
  • Brushes to use for drawing negative elements, when using a chart type with contextual coloring, such as Waterfall.

    Use the NegativeOutlines property to set a collection of brushes that will be used to render outline of negative elements in the price pane, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    negativeOutlines= "Green"/>

    Returns string[]

  • set negativeOutlines(v): void
  • Parameters

    • v: string[]

    Returns void

  • get outlineMode(): SeriesOutlineMode
  • Gets or sets the OutlineMode for all series in this chart.

    Returns SeriesOutlineMode

  • set outlineMode(v): void
  • Parameters

    Returns void

  • get outlines(): string[]
  • Gets or sets the palette of brushes to use for outlines on the chart series. The value provided should be an array of CSS color strings or JavaScript objects defining gradients. Optionally the first element can be a string reading "RGB" or "HSV" to specify the interpolation mode of the collection

    Use the Outlines property to sets the palette of brushes to use for outlines on the chart series

    <IgrCategoryChart
    chartType="Line"
    outlines= "#ff0000"
    dataSource={this.categoryData}/>

    Returns string[]

  • set outlines(v): void
  • Parameters

    • v: string[]

    Returns void

  • get overlayBrushes(): string[]
  • Brushes to use for filling financial overlays.

    Use the OverlayBrushes property to set a collection of brushes that will be used to render fill area of overlays in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    overlayBrushes="Green" />

    Returns string[]

  • set overlayBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get overlayMultiplier(): number
  • The multiplier of financial overlay, e.g. BollingerBands overlay.

    Returns number

  • set overlayMultiplier(v): void
  • Parameters

    • v: number

    Returns void

  • get overlayOutlines(): string[]
  • Brushes to use for outlining financial overlays.

    Use the OverlayOutlines property to set a collection of brushes that will be used to render outlines of overlays in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    overlayOutlines="Red" />

    Returns string[]

  • set overlayOutlines(v): void
  • Parameters

    • v: string[]

    Returns void

  • get overlayThickness(): number
  • The outline thickness of financial overlays.

    Use the OverlayThickness property to set a number that will be used to render outline thickness of all overlays in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    overlayThickness ={2.5} />

    Returns number

  • set overlayThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get overlayTypes(): IgrFinancialOverlayTypeCollection
  • A collection indicating what financial overlay types to display on the Financial Chart.

    Use the OverlayTypes property to set types of overlays that will be rendered behind price series in the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    overlayType ="PriceChannel" />

    Returns IgrFinancialOverlayTypeCollection

  • set overlayTypes(v): void
  • Parameters

    Returns void

  • get pixelScalingRatio(): number
  • Gets or sets the scaling value used to affect the pixel density of the control. A higher scaling ratio will produce crisper visuals at the expense of memory. Lower values will cause the control to appear blurry.

    Returns number

  • set pixelScalingRatio(v): void
  • Parameters

    • v: number

    Returns void

  • get plotAreaMarginBottom(): number
  • Margin applied below the plot area.

    Returns number

  • set plotAreaMarginBottom(v): void
  • Parameters

    • v: number

    Returns void

  • get plotAreaMarginLeft(): number
  • Margin applied to the Left of the plot area.

    Returns number

  • set plotAreaMarginLeft(v): void
  • Parameters

    • v: number

    Returns void

  • get plotAreaMarginRight(): number
  • Margin applied to the right of the plot area.

    Returns number

  • set plotAreaMarginRight(v): void
  • Parameters

    • v: number

    Returns void

  • get plotAreaMarginTop(): number
  • Margin applied to the Top of the plot area.

    Returns number

  • set plotAreaMarginTop(v): void
  • Parameters

    • v: number

    Returns void

  • get rangeSelectorTemplate(): any
  • Returns any

  • set rangeSelectorTemplate(value): void
  • Parameters

    • value: any

    Returns void

  • get resolution(): number
  • Gets or sets the rendering resolution for all series in this chart. Where n = Resolution, for every n horizontal pixels, combine all items into a single datapoint. When Resolution = 0, all datapoints will be rendered as graphical objects. Charts with a higher resolution will have faster performance.

    Returns number

  • set resolution(v): void
  • Parameters

    • v: number

    Returns void

  • get rightMargin(): number
  • Gets or sets the right margin of the chart content.

    Use rightMargin property for the right margin of the chart content.

      this.chart.rightMargin = 20 ;
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    rightMargin= {4}/>

    Returns number

  • set rightMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get selectedSeriesItems(): IgrChartSelectedItemCollection
  • Gets the currently selected data items. Adding or removing data items from this collection will select or deselect the visuals associated with those items.

    Returns IgrChartSelectedItemCollection

  • set selectedSeriesItems(v): void
  • Parameters

    Returns void

  • get selectionBehavior(): SeriesSelectionBehavior
  • Gets or sets the selection behavior to use for the series in the component, when supported.

    Returns SeriesSelectionBehavior

  • set selectionBehavior(v): void
  • Parameters

    Returns void

  • get selectionBrush(): string
  • Gets or sets the selection brush to use for the series.

    Returns string

  • set selectionBrush(v): void
  • Parameters

    • v: string

    Returns void

  • get selectionMode(): SeriesSelectionMode
  • Gets or sets the selection mode to use for the series in the component, when supported.

    Returns SeriesSelectionMode

  • set selectionMode(v): void
  • Parameters

    Returns void

  • get seriesAdded(): ((s, e) => void)
  • Event raised when a series is initialized and added to this chart.

    SeriesAdded event raised when a series is initialized and added to this chart.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    seriesAdded={this.CategoryChart_SeriesAdded}/>
    ``

    ```ts
    CategoryChart_SeriesAdded(sender:any ,aregs:ChartSeriesEventArgs)
    {
    }

    Returns ((s, e) => void)

      • (s, e): void
      • Event raised when a series is initialized and added to this chart.

        SeriesAdded event raised when a series is initialized and added to this chart.

         <IgrCategoryChart
        width="100%"
        height="100%"
        chartType="Line"
        markerTypes={this.state.markersTypes}
        dataSource={this.categoryData}
        seriesAdded={this.CategoryChart_SeriesAdded}/>
        ``

        ```ts
        CategoryChart_SeriesAdded(sender:any ,aregs:ChartSeriesEventArgs)
        {
        }

        Parameters

        Returns void

  • set seriesAdded(ev): void
  • Parameters

    Returns void

  • get seriesPlotAreaMarginHorizontalMode(): SeriesPlotAreaMarginHorizontalMode
  • Gets or sets horizontal mode to use for automatically calculating the plot area margin based ont the series.

    Returns SeriesPlotAreaMarginHorizontalMode

  • set seriesPlotAreaMarginHorizontalMode(v): void
  • Parameters

    Returns void

  • get seriesPlotAreaMarginVerticalMode(): SeriesPlotAreaMarginVerticalMode
  • Gets or sets vertical mode to use for automatically calculating the plot area margin based ont the series.

    Returns SeriesPlotAreaMarginVerticalMode

  • set seriesPlotAreaMarginVerticalMode(v): void
  • Parameters

    Returns void

  • get seriesPointerDown(): ((s, e) => void)
  • Occurs when the pointer is pressed down over a Series.

    SeriesPointerDown event raised when the pointer is pressed down over a Series

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    seriesPointerDown={this.CategoryChart_seriesPointerDown}/>
    ``

    ```ts
    CategoryChart_seriesPointerDown(sender: any , aregs: ChartSeriesEventArgs)
    {

    }

    Returns ((s, e) => void)

      • (s, e): void
      • Occurs when the pointer is pressed down over a Series.

        SeriesPointerDown event raised when the pointer is pressed down over a Series

         <IgrCategoryChart
        width="100%"
        height="100%"
        chartType="Line"
        markerTypes={this.state.markersTypes}
        dataSource={this.categoryData}
        seriesPointerDown={this.CategoryChart_seriesPointerDown}/>
        ``

        ```ts
        CategoryChart_seriesPointerDown(sender: any , aregs: ChartSeriesEventArgs)
        {

        }

        Parameters

        Returns void

  • set seriesPointerDown(ev): void
  • Parameters

    Returns void

  • get seriesPointerEnter(): ((s, e) => void)
  • Occurs when the pointer enters a Series.

    SeriesPointerEnter event raised when the pointer enters a Series.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    seriesPointerEnter={this.CategoryChart_seriesPointerDown}/>
    CategoryChart_seriesPointerEnter(sender: any , aregs: ChartSeriesEventArgs)
    {

    }

    Returns ((s, e) => void)

      • (s, e): void
      • Occurs when the pointer enters a Series.

        SeriesPointerEnter event raised when the pointer enters a Series.

         <IgrCategoryChart
        width="100%"
        height="100%"
        chartType="Line"
        markerTypes={this.state.markersTypes}
        dataSource={this.categoryData}
        seriesPointerEnter={this.CategoryChart_seriesPointerDown}/>
        CategoryChart_seriesPointerEnter(sender: any , aregs: ChartSeriesEventArgs)
        {

        }

        Parameters

        Returns void

  • set seriesPointerEnter(ev): void
  • Parameters

    Returns void

  • get seriesPointerLeave(): ((s, e) => void)
  • Occurs when the pointer leaves a Series.

    SeriesPointerLeave event raised when the pointer leaves a Series.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    seriesPointerLeave={this.CategoryChart_seriesPointerLeave}/>
    CategoryChart_seriesPointerLeave(sender: any , aregs: ChartSeriesEventArgs)
    {

    }

    Returns ((s, e) => void)

      • (s, e): void
      • Occurs when the pointer leaves a Series.

        SeriesPointerLeave event raised when the pointer leaves a Series.

         <IgrCategoryChart
        width="100%"
        height="100%"
        chartType="Line"
        markerTypes={this.state.markersTypes}
        dataSource={this.categoryData}
        seriesPointerLeave={this.CategoryChart_seriesPointerLeave}/>
        CategoryChart_seriesPointerLeave(sender: any , aregs: ChartSeriesEventArgs)
        {

        }

        Parameters

        Returns void

  • set seriesPointerLeave(ev): void
  • Parameters

    Returns void

  • get seriesPointerMove(): ((s, e) => void)
  • Occurs when the pointer moves over a Series.

    SeriesPointerMove event raised when the pointer moves over a Series.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    seriesPointerMove={this.CategoryChart_seriesPointerMove}/>
     CategoryChart_seriesPointerMove(sender: any , aregs: ChartSeriesEventArgs)
    {

    }

    Returns ((s, e) => void)

      • (s, e): void
      • Occurs when the pointer moves over a Series.

        SeriesPointerMove event raised when the pointer moves over a Series.

         <IgrCategoryChart
        width="100%"
        height="100%"
        chartType="Line"
        markerTypes={this.state.markersTypes}
        dataSource={this.categoryData}
        seriesPointerMove={this.CategoryChart_seriesPointerMove}/>
         CategoryChart_seriesPointerMove(sender: any , aregs: ChartSeriesEventArgs)
        {

        }

        Parameters

        Returns void

  • set seriesPointerMove(ev): void
  • Parameters

    Returns void

  • get seriesPointerUp(): ((s, e) => void)
  • Occurs when the pointer is released over a Series.

    SeriesPointerUp event raised when the pointer is released over a Series.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    seriesPointerUp={this.CategoryChart_seriesPointerUp}/>
     CategoryChart_seriesPointerUp(sender: any , aregs: ChartSeriesEventArgs)
    {

    }

    Returns ((s, e) => void)

      • (s, e): void
      • Occurs when the pointer is released over a Series.

        SeriesPointerUp event raised when the pointer is released over a Series.

         <IgrCategoryChart
        width="100%"
        height="100%"
        chartType="Line"
        markerTypes={this.state.markersTypes}
        dataSource={this.categoryData}
        seriesPointerUp={this.CategoryChart_seriesPointerUp}/>
         CategoryChart_seriesPointerUp(sender: any , aregs: ChartSeriesEventArgs)
        {

        }

        Parameters

        Returns void

  • set seriesPointerUp(ev): void
  • Parameters

    Returns void

  • get seriesRemoved(): ((s, e) => void)
  • Event raised when a series is removed from this chart.

    SeriesRemoved event raised when a series is removed from this chart.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    markerTypes={this.state.markersTypes}
    dataSource={this.categoryData}
    seriesRemoved={this.CategoryChart_seriesRemoved}/>
     CategoryChart_seriesRemoved(sender: any , aregs: ChartSeriesEventArgs)
    {

    }

    Returns ((s, e) => void)

      • (s, e): void
      • Event raised when a series is removed from this chart.

        SeriesRemoved event raised when a series is removed from this chart.

         <IgrCategoryChart
        width="100%"
        height="100%"
        chartType="Line"
        markerTypes={this.state.markersTypes}
        dataSource={this.categoryData}
        seriesRemoved={this.CategoryChart_seriesRemoved}/>
         CategoryChart_seriesRemoved(sender: any , aregs: ChartSeriesEventArgs)
        {

        }

        Parameters

        Returns void

  • set seriesRemoved(ev): void
  • Parameters

    Returns void

  • get shouldAvoidAxisAnnotationCollisions(): boolean
  • Gets or sets whether annotations for the final value of each series is displayed on the axis.

    Returns boolean

  • set shouldAvoidAxisAnnotationCollisions(v): void
  • Parameters

    • v: boolean

    Returns void

  • get shouldDisplayMockData(): boolean
  • Gets or sets whether the chart should display mock data when the data source has not been provided, if supported for this type of chart.

    Returns boolean

  • set shouldDisplayMockData(v): void
  • Parameters

    • v: boolean

    Returns void

  • get shouldPanOnMaximumZoom(): boolean
  • Gets or sets a whether the chart should pan its content when zoo,ing in passed max zoom level.

    Returns boolean

  • set shouldPanOnMaximumZoom(v): void
  • Parameters

    • v: boolean

    Returns void

  • get shouldUseSkeletonStyleForMockData(): boolean
  • Gets or sets whether the chart should use a faded skeleton style for mock data.

    Returns boolean

  • set shouldUseSkeletonStyleForMockData(v): void
  • Parameters

    • v: boolean

    Returns void

  • get sortDescriptions(): IgrChartSortDescriptionCollection
  • Gets the current sort that is applied to the grid. Collection can be updated to modify the sort for the grid. Once sort descriptions are in this collection, the grid will no longer listen for changes on their properties.

    Returns IgrChartSortDescriptionCollection

  • get subtitle(): string
  • Gets or sets text to display below the Title, above the plot area.

    Use the Subtitle property to display the text below and above the plot area.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"/>
     this.chart.subtitle ="CategoryChart Subtitle" ;
    

    Returns string

  • set subtitle(v): void
  • Parameters

    • v: string

    Returns void

  • get subtitleAlignment(): HorizontalAlignment
  • Gets or sets horizontal alignment which determines the subtitle position, relative to the left and right edges of the control.

    Use the SubtitleAlignment property to Gets or sets horizontal alignment.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"
    subtitleAlignment="Right"/>
    this.chart.subtitleAlignment = HorizontalAlignment.Right;
    

    Returns HorizontalAlignment

  • set subtitleAlignment(v): void
  • Parameters

    • v: HorizontalAlignment

    Returns void

  • get subtitleBottomMargin(): number
  • Gets or sets the bottom margin of chart subtitle

    Use subtitleBottomMargin property for the bottom margin of chart subtitle.

     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"
    subtitleBottomMargin= {10}/>
    this.chart.subtitleBottomMargin = 10 ;
    

    Returns number

  • set subtitleBottomMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get subtitleLeftMargin(): number
  • Gets or sets the left margin of chart subtitle

    Use subtitleLeftMargin property for the left margin of chart subtitle.

    this.chart.subtitleLeftMargin = 20 ;
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"
    subtitleLeftMargin= {20}/>

    Returns number

  • set subtitleLeftMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get subtitleRightMargin(): number
  • Gets or sets the right margin of chart subtitle

    Use subtitleRightMargin property for the right margin of chart subtitle.

     this.chart.subtitleRightMargin = 20 ;
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"
    subtitleAlignment="Right"
    subtitleRightMargin ={20}/>

    Returns number

  • set subtitleRightMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get subtitleTextColor(): string
  • Gets or sets color of chart subtitle

    Use subtitleTextColor property to color the subtitle.

    this.chart.subtitleTextColor = "#ff0000" ;
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"
    subtitleTextColor="#ff0000"/>

    Returns string

  • set subtitleTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get subtitleTextStyle(): string
  • Gets or sets CSS font property for the chart subtitle

    Use subtitleTextStyle property for the CSS font of the chart subtitle.

    this.chart.subtitleTextStyle= "16pt Verdona";
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitleTextStyle="16pt Verdona"/>

    Returns string

  • set subtitleTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get subtitleTopMargin(): number
  • Gets or sets the top margin of chart subtitle

    Use subtitleTopMargin property for the top margin of chart subtitle.

    this.chart.subtitleTopMargin = 10;
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"
    subtitleTopMargin= {10}/>

    Returns number

  • set subtitleTopMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get thickness(): number
  • Gets or sets the thickness for all series in this chart. Depending on the ChartType, this can be the main brush used, or just the outline.

    Use the Thickness property for the thickness of all the series in this chart.

    Returns number

  • set thickness(v): void
  • Parameters

    • v: number

    Returns void

  • get titleAlignment(): HorizontalAlignment
  • Gets or sets horizontal alignment which determines the title position, relative to the left and right edges of the control.

    Use the TitleAlignment property for the horizontal alignment of the title.

    this.chart.titleAlignment = HorizontalAlignment.Center;
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    titleAlignment= "Center"/>

    Returns HorizontalAlignment

  • set titleAlignment(v): void
  • Parameters

    • v: HorizontalAlignment

    Returns void

  • get titleBottomMargin(): number
  • Gets or sets the bottom margin of chart title

    Use titleBottomMargin property for the bottom margin of chart title.

     this.chart.titleBottomMargin = 5;
    
     <IgrCategoryChart
    width="100%"
    height="100%"
    chartType="Line"
    dataSource={this.categoryData}
    subtitle= "CategoryChart Subtitle"
    subtitleAlignment="Right"
    titleBottomMargin={5}/>

    Returns number

  • set titleBottomMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get titleLeftMargin(): number
  • Gets or sets the left margin of chart title

    Use titleLeftMargin property for the left margin of chart title.

    this.chart.titleLeftMargin = 10;
    
     <IgrCategoryChart dataSource={this.state.data}
    titleLeftMargin={20}>
    </IgrCategoryChart>

    Returns number

  • set titleLeftMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get titleRightMargin(): number
  • Gets or sets the right margin of chart title

    Use titleLeftMargin property for the right margin of chart title.

    this.chart.titleRightMargin = 10;
    
    <IgrCategoryChart
    dataSource={this.state.data}
    titleRightMargin = 10>
    </IgrCategoryChart>

    Returns number

  • set titleRightMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get titleTextColor(): string
  • Gets or sets color of chart title

    Use titleTextColor property to color the chart title

     this.chart.titleTextColor="red" ;
    
    <IgrCategoryChart
    dataSource={this.state.data}
    width="700px"
    height="500px"
    xAxisTitle="Countries"
    titleTextColor="Red" />

    Returns string

  • set titleTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get titleTextStyle(): string
  • Gets or sets CSS font property for the chart title

    Use titleTextStyle property for the CSS font property of the chart title

    this.chart.xAxisTitleTextStyle = "24pt Verdona";
    
    <IgrCategoryChart dataSource={this.state.data}
    width="700px"
    height="500px"
    xAxisTitle="Countries"
    xAxisTitleTextColor="gray"
    xAxisTitleTextStyle="12pt Verdana"
    xAxisTitleAngle={0}
    yAxisTitle="Trillions of Watt-hours (TWh)"
    yAxisTitleTextStyle="12pt Verdana"
    yAxisTitleTextColor="gray"
    yAxisTitleAngle={90}
    yAxisTitleLeftMargin={5}>
    </IgrCategoryChart>

    Returns string

  • set titleTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get titleTopMargin(): number
  • Gets or sets the top margin of chart title

    Use titleTopMargin property for the top margin of chart title.

    this.chart.titleTopMargin = 10;
    
    <IgrCategoryChart dataSource={this.state.data}
    titleTopMargin={10} />

    Returns number

  • set titleTopMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get toolTipType(): ToolTipType
  • Gets or sets the style of tooltip to be displayed.

    Returns ToolTipType

  • set toolTipType(v): void
  • Parameters

    Returns void

  • get toolbarHeight(): number
  • Returns number

  • set toolbarHeight(v): void
  • Parameters

    • v: number

    Returns void

  • get toolbarTemplate(): any
  • Returns any

  • set toolbarTemplate(value): void
  • Parameters

    • value: any

    Returns void

  • get tooltipTemplate(): FunctionComponent<IChartTooltipProps> | Component<IChartTooltipProps, {}, any>
  • Sets or gets the template reference to use for tooltips for all the series.

    Returns FunctionComponent<IChartTooltipProps> | Component<IChartTooltipProps, {}, any>

  • set tooltipTemplate(v): void
  • Parameters

    • v: FunctionComponent<IChartTooltipProps> | Component<IChartTooltipProps, {}, any>

    Returns void

  • get tooltipTemplates(): (FunctionComponent<IChartTooltipProps> | Component<IChartTooltipProps, {}, any>)[]
  • Sets or gets the template references to use for tooltips for all the series, in order.

    Returns (FunctionComponent<IChartTooltipProps> | Component<IChartTooltipProps, {}, any>)[]

  • set tooltipTemplates(v): void
  • Parameters

    • v: (FunctionComponent<IChartTooltipProps> | Component<IChartTooltipProps, {}, any>)[]

    Returns void

  • get topMargin(): number
  • Gets or sets the top margin of the chart content.

    Use topMargin property for the margin of the chart content.

    this.chart.topMargin=20;
    
    <IgrCategoryChart dataSource={this.state.data}
    topMargin={10} />

    Returns number

  • set topMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get transitionDuration(): number
  • Gets or sets the duration used for animating series plots when the data is changing

    Use the TransitionDuration property to animating between data values.

    this.chart.transitionDuratio= 500;
    
    <IgrCategoryChart dataSource={this.state.data}
    transitionDuratio={500} />

    Returns number

  • set transitionDuration(v): void
  • Parameters

    • v: number

    Returns void

  • get transitionEasingFunction(): ((time) => number)
  • Gets or sets the easing function used for animating series plots when the data is changing. This can be set to one of the known values "linear" or "cubic," or it can be set to an easing function which takes a single numeric parameter and returns a number.

    The 'transitionInEasingFunction' property used for easing function for animating series plots when the chart is loading into view.

    this.chart.transitionInEasingFunction=  this.cubicFunc;

    cubicFunc(time: number) : number
    {
    return time;
    }
    <IgrCategoryChart dataSource={this.state.data}
    transitionInEasingFunction="cubic" />

    Returns ((time) => number)

      • (time): number
      • Gets or sets the easing function used for animating series plots when the data is changing. This can be set to one of the known values "linear" or "cubic," or it can be set to an easing function which takes a single numeric parameter and returns a number.

        The 'transitionInEasingFunction' property used for easing function for animating series plots when the chart is loading into view.

        this.chart.transitionInEasingFunction=  this.cubicFunc;

        cubicFunc(time: number) : number
        {
        return time;
        }
        <IgrCategoryChart dataSource={this.state.data}
        transitionInEasingFunction="cubic" />

        Parameters

        • time: number

        Returns number

  • set transitionEasingFunction(v): void
  • Parameters

    • v: ((time) => number)
        • (time): number
        • Parameters

          • time: number

          Returns number

    Returns void

  • get trendLineBrushes(): string[]
  • Gets or sets the palette of brushes to used for coloring trend lines in this chart. The value provided should be an array of CSS color strings or JavaScript objects defining gradients. Optionally the first element can be a string reading "RGB" or "HSV" to specify the interpolation mode of the collection

    Use the TrendLineBrushes property for coloring trend lines in the chart.

    this.chart.trendLineBrushes=["#ff0000", "#ffff00", "#00ffff"]	;
    
    <IgrCategoryChart dataSource={this.state.data}
    trendLineBrushes="#ffff00" />

    Returns string[]

  • set trendLineBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get trendLinePeriod(): number
  • Returns number

  • set trendLinePeriod(v): void
  • Parameters

    • v: number

    Returns void

  • get trendLineThickness(): number
  • Gets or sets the thickness of the trend lines in this chart. This property applies only to these chart types: point, line, spline, and bubble

    Use the TrendLineThickness property for the thickness of the trend lines in the chart.

    this.chart.trendLineThickness=2;
    
    <IgrCategoryChart dataSource={this.state.data}
    trendLineThickness={2} />

    Returns number

  • set trendLineThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get trendLineType(): TrendLineType
  • Gets or sets the formula used for calculating trend lines in this chart. This property applies only to these chart types: point, line, spline, and bubble

    Use the TrendLineType property for calculating trend lines.

    this.chart.trendLineType = TrendLineType.CubicFit;
    
    <IgrCategoryChart dataSource={this.state.data}
    trendLineType="CubicFit" />

    Returns TrendLineType

  • set trendLineType(v): void
  • Parameters

    • v: TrendLineType

    Returns void

  • get unknownValuePlotting(): UnknownValuePlotting
  • Gets or sets the behavior that determines how unknown values will be plotted on the chart. Null and Double.NaN are two examples of unknown values.

    Use the UnknownValuePlotting property to determines the behavior that how unknown values will be plotted on the chart.

    this.chart.unknownValuePlotting =UnknownValuePlotting.DontPlot;
    
    <IgrCategoryChart dataSource={this.state.data}
    unknownValuePlotting= "dontPlot" />

    Returns UnknownValuePlotting

  • set unknownValuePlotting(v): void
  • Parameters

    • v: UnknownValuePlotting

    Returns void

  • get valueLines(): IgrValueModeCollection
  • Gets or sets what value lines to use in the chart.

    Returns IgrValueModeCollection

  • set valueLines(v): void
  • Parameters

    Returns void

  • get valueLinesBrushes(): string[]
  • Gets or sets the palette of brushes to use for coloring the value lines present in the ValueLines property. The value provided should be an array of CSS color strings or JavaScript objects defining gradients. Optionally the first element can be a string reading "RGB" or "HSV" to specify the interpolation mode of the collection

    Returns string[]

  • set valueLinesBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get valueLinesThickness(): number
  • Gets or sets thickness of value lines.

    Returns number

  • set valueLinesThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get verticalViewScrollbarCornerRadius(): number
  • Gets or sets the corner radius to use for the vertical scrollbar in the component, when enabled.

    Returns number

  • set verticalViewScrollbarCornerRadius(v): void
  • Parameters

    • v: number

    Returns void

  • get verticalViewScrollbarFill(): string
  • Gets or sets the fill to use for the vertical scrollbar in the component, when enabled.

    Returns string

  • set verticalViewScrollbarFill(v): void
  • Parameters

    • v: string

    Returns void

  • get verticalViewScrollbarInset(): number
  • Gets or sets the inset distance to use for the vertical scrollbar in the component, when enabled.

    Returns number

  • set verticalViewScrollbarInset(v): void
  • Parameters

    • v: number

    Returns void

  • get verticalViewScrollbarMaxOpacity(): number
  • Gets or sets the max opacity to use for the vertical scrollbar in the component, when enabled.

    Returns number

  • set verticalViewScrollbarMaxOpacity(v): void
  • Parameters

    • v: number

    Returns void

  • get verticalViewScrollbarMode(): SeriesViewerScrollbarMode
  • Gets or sets the vertical scrollbar mode to use for the series viewer.

    Returns SeriesViewerScrollbarMode

  • set verticalViewScrollbarMode(v): void
  • Parameters

    Returns void

  • get verticalViewScrollbarOutline(): string
  • Gets or sets the outline to use for the vertical scrollbar in the component, when enabled.

    Returns string

  • set verticalViewScrollbarOutline(v): void
  • Parameters

    • v: string

    Returns void

  • get verticalViewScrollbarPosition(): SeriesViewerVerticalScrollbarPosition
  • Gets or sets the position to use for the vertical scrollbar in the component, when enabled.

    Returns SeriesViewerVerticalScrollbarPosition

  • set verticalViewScrollbarPosition(v): void
  • Parameters

    Returns void

  • get verticalViewScrollbarShouldAddAutoTrackInsets(): boolean
  • Gets or sets whether to use automatic track insets for the vertical scrollbar in the component, when enabled.

    Returns boolean

  • set verticalViewScrollbarShouldAddAutoTrackInsets(v): void
  • Parameters

    • v: boolean

    Returns void

  • get verticalViewScrollbarStrokeThickness(): number
  • Gets or sets the stroke thickness to use for the vertical scrollbar in the component, when enabled.

    Returns number

  • set verticalViewScrollbarStrokeThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get verticalViewScrollbarTrackEndInset(): number
  • Gets or sets the track end inset to use for the vertical scrollbar in the component, when enabled.

    Returns number

  • set verticalViewScrollbarTrackEndInset(v): void
  • Parameters

    • v: number

    Returns void

  • get verticalViewScrollbarTrackStartInset(): number
  • Gets or sets the track start inset to use for the vertical scrollbar in the component, when enabled.

    Returns number

  • set verticalViewScrollbarTrackStartInset(v): void
  • Parameters

    • v: number

    Returns void

  • get verticalViewScrollbarWidth(): number
  • Gets or sets the width to use for the vertical scrollbar in the component, when enabled.

    Returns number

  • set verticalViewScrollbarWidth(v): void
  • Parameters

    • v: number

    Returns void

  • get viewport(): IgRect
  • Gets a rectangle representing the bounds of the plot area.

    viewport property representing the bounds of the plot area.

    let viewport:Rect =  this.chart.viewport;
    

    Returns IgRect

  • get volumeBrushes(): string[]
  • Brushes to use for filling volume series in the volume pane.

    Use the VolumeBrushes property to set a collection of brushes that will be used to render fill area of multiple series in the volume pane of the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    volumeBrushes="Green" />

    Returns string[]

  • set volumeBrushes(v): void
  • Parameters

    • v: string[]

    Returns void

  • get volumeOutlines(): string[]
  • Brushes to use for outlining volume series in the volume pane.

    Use the VolumeOutlines property to set a collection of brushes that will be used to render outline of multiple series in the volume pane of the Financial Chart control, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    volumeOutlines="Green" />

    Returns string[]

  • set volumeOutlines(v): void
  • Parameters

    • v: string[]

    Returns void

  • get volumeThickness(): number
  • The outline thickness of volume series in the volume pane.

    Use the VolumeThickness property to set a number that will be used to render outline thickness of all series in the volume pane, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    volumeThickness= {2.5}/>

    Returns number

  • set volumeThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get volumeType(): FinancialChartVolumeType
  • The type of series to display in the volume pane.

    Use the VolumeType property to set a type of all series that will be rendered in the volume pane, e.g.

    <IgrFinancialChart
    width="100%"
    height="400px"
    dataSource={this.data}
    volumeType="Column" />

    Returns FinancialChartVolumeType

  • set volumeType(v): void
  • Parameters

    Returns void

  • get width(): string
  • Returns string

  • set width(value): void
  • Parameters

    • value: string

    Returns void

  • get windowRect(): IgRect
  • Gets or sets the rectangle representing the current scroll and zoom state of the chart. WindowRect is expressed as a Rectangle with coordinates and sizes between 0 and 1.

    Use WindowRect property representing the current scroll and zoom state of the chart.

    this.chart.windowRect =[0,0,1,1];
    
    <IgrCategoryChart dataSource={this.state.data}
    WindowRect={1,0,1,1} />

    Returns IgRect

  • set windowRect(v): void
  • Parameters

    • v: IgRect

    Returns void

  • get windowRectMinHeight(): number
  • Sets or gets the minimum height that the window rect is allowed to reach before being clamped. Decrease this value if you want to allow for further zooming into the viewer. If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. This property accepts values between 0.0 (max zooming) and 1.0 (no zooming)

    Returns number

  • set windowRectMinHeight(v): void
  • Parameters

    • v: number

    Returns void

  • get windowRectMinWidth(): number
  • Sets or gets the minimum width that the window rect is allowed to reach before being clamped. Decrease this value if you want to allow for further zooming into the viewer. If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. This property accepts values between 0.0 (max zooming) and 1.0 (no zooming)

    Returns number

  • set windowRectMinWidth(v): void
  • Parameters

    • v: number

    Returns void

  • get windowSizeMinHeight(): number
  • Sets or gets minimum pixel height that the window is allowed to reach before being clamped. Decrease this value if you want to allow for further zooming into the viewer. If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. This property is overridden by the WindowRectMinHeight property

    Returns number

  • set windowSizeMinHeight(v): void
  • Parameters

    • v: number

    Returns void

  • get windowSizeMinWidth(): number
  • Sets or gets minimum pixel width that the window is allowed to reach before being clamped. Decrease this value if you want to allow for further zooming into the viewer. If this value is lowered too much it can cause graphical corruption due to floating point arithmetic inaccuracy. This property is overridden by the WindowRectMinWidth property

    Returns number

  • set windowSizeMinWidth(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisBreaks(): IgCollection<any, any>
  • TimeAxisBreaks to apply to this chart when in time axis mode, representing spans of time to omit, such as weekends.

    Returns IgCollection<any, any>

  • set xAxisBreaks(v): void
  • Parameters

    • v: IgCollection<any, any>

    Returns void

  • get xAxisEnhancedIntervalPreferMoreCategoryLabels(): boolean
  • Gets or sets whether the x axis enhanced interval management should prefer to show all the labels if possible without collisions for supported types of category axes. This is for use with EnhancedIntervalMinimumCharacters = -1 and axes that have an integral interval.

    Returns boolean

  • set xAxisEnhancedIntervalPreferMoreCategoryLabels(v): void
  • Parameters

    • v: boolean

    Returns void

  • get xAxisExtent(): number
  • Gets or sets the distance between the X-axis and the bottom of the chart.

    To allocate space between the x-axis and the edge of the chart, set the XAxisExtent property.

    this.chart.xAxisExtent="250";
    
    <IgrCategoryChart
    xAxisExtent ={250}
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns number

  • set xAxisExtent(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisFormatLabel(): ((item) => string)
  • Gets or sets function which takes an context object and returns a formatted label for the X-axis.

    To customize the text of the x-axis label, set XAxisFormatLabel to a single-parameter function. The argument passed to that function will be your data item.

    formatX(item: any): string {
    return "[ " + item.label + "! ]";
    }
    <IgrCategoryChart
    xAxisFormatLabel="formatX"
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns ((item) => string)

      • (item): string
      • Gets or sets function which takes an context object and returns a formatted label for the X-axis.

        To customize the text of the x-axis label, set XAxisFormatLabel to a single-parameter function. The argument passed to that function will be your data item.

        formatX(item: any): string {
        return "[ " + item.label + "! ]";
        }
        <IgrCategoryChart
        xAxisFormatLabel="formatX"
        dataSource={this.state.data}
        chartType="stepArea" >
        </IgrCategoryChart>

        Parameters

        • item: any

        Returns string

  • set xAxisFormatLabel(v): void
  • Parameters

    • v: ((item) => string)
        • (item): string
        • Parameters

          • item: any

          Returns string

    Returns void

  • get xAxisInverted(): boolean
  • Gets or sets whether to invert the direction of the X-axis by placing the first data items on the right side of the chart.

    To reverse the direction of items along the x-axis, set the XAxisInverted property to true.

    this.chart.XAxisInverted="True";
    
    <IgrCategoryChart
    XAxisInverted="True"
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns boolean

  • set xAxisInverted(v): void
  • Parameters

    • v: boolean

    Returns void

  • get xAxisLabel(): any
  • Gets or sets the format for labels along the X-axis.

    Returns any

  • set xAxisLabel(v): void
  • Parameters

    • v: any

    Returns void

  • get xAxisLabelAngle(): number
  • Gets or sets the angle of rotation for labels along the X-axis.

    To control the rotation of labels on the x-axis, set the XAxisLabelAngle property to a number of rotational degrees.

    this.chart.xAxisLabelAngle="45";
    
    <IgrCategoryChart
    xAxisLabelAngle={45}
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns number

  • set xAxisLabelAngle(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisLabelBottomMargin(): number
  • Gets or sets the bottom margin of labels on the X-axis

    Use the XAxisLabelBottomMargin property to apply a margin below the x-axis labels.

    this.chart.xAxisLabelBottomMargin ="100";
    
    <IgrCategoryChart
    xAxisLabelBottomMargin={100}
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns number

  • set xAxisLabelBottomMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisLabelFormat(): string
  • Gets or sets the format string for the X axis label.

    Returns string

  • set xAxisLabelFormat(v): void
  • Parameters

    • v: string

    Returns void

  • get xAxisLabelFormatSpecifiers(): any[]
  • Gets or sets the format specifiers to use with the XAxisLabelFormat string.

    Returns any[]

  • set xAxisLabelFormatSpecifiers(v): void
  • Parameters

    • v: any[]

    Returns void

  • get xAxisLabelHorizontalAlignment(): HorizontalAlignment
  • Gets or sets Horizontal alignment of X-axis labels.

    Returns HorizontalAlignment

  • set xAxisLabelHorizontalAlignment(v): void
  • Parameters

    • v: HorizontalAlignment

    Returns void

  • get xAxisLabelLeftMargin(): number
  • Gets or sets the left margin of labels on the X-axis

    Use the XAxisLabelLeftMargin property to apply a margin left of the x-axis labels.

    this.chart.xAxisLabelLeftMargin ="100";
    
    <IgrCategoryChart
    xAxisLabelLeftMargin={100}
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns number

  • set xAxisLabelLeftMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisLabelLocation(): XAxisLabelLocation
  • Gets or sets location of X-axis labels, relative to the plot area.

    Returns XAxisLabelLocation

  • set xAxisLabelLocation(v): void
  • Parameters

    Returns void

  • get xAxisLabelRightMargin(): number
  • Gets or sets the right margin of labels on the X-axis

    Use the XAxisLabelRightMargin property to apply a margin right of the x-axis labels.

    this.chart.xAxisLabelRightMargin="100";
    
    <IgrCategoryChart
    xAxisLabelRightMargin={250}
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns number

  • set xAxisLabelRightMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisLabelTextColor(): string
  • Gets or sets color of labels on the X-axis

    To change the color of x-axis labels, set the XAxisLabelTextColor property to a color string.

    this.chart.xAxisLabelTextColor="green";
    
    <IgrCategoryChart
    xAxisLabelTextColor="green"
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns string

  • set xAxisLabelTextColor(v): void
  • Parameters

    • v: string

    Returns void

  • get xAxisLabelTextStyle(): string
  • Gets or sets CSS font property for labels on X-axis

    To change the font of x-axis labels, set the XAxisLabelTextStyle property.

    this.chart.xAxisLabelTextStyle="italic 15px arial, sans-serif";
    
    <IgrCategoryChart
    xAxisLabelTextStyle="italic 15px arial, sans-serif"
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns string

  • set xAxisLabelTextStyle(v): void
  • Parameters

    • v: string

    Returns void

  • get xAxisLabelTopMargin(): number
  • Gets or sets the top margin of labels on the X-axis

    Use the XAxisLabelTopMargin property to apply a margin above the x-axis labels.

    this.chart.xAxisTitleTopMargin="250";
    
    <IgrCategoryChart
    xAxisTitleTopMargin ={250}
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns number

  • set xAxisLabelTopMargin(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisLabelVerticalAlignment(): VerticalAlignment
  • Gets or sets Vertical alignment of X-axis labels.

    Use the XAxisLabelVerticalAlignment property to change the vertical position of x-axis labels.

    this.chart.xAxisLabelVerticalAlignment="bottom";
    
    <IgrCategoryChart
    xAxisLabelVerticalAlignment="bottom"
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns VerticalAlignment

  • set xAxisLabelVerticalAlignment(v): void
  • Parameters

    • v: VerticalAlignment

    Returns void

  • get xAxisLabelVisibility(): Visibility
  • Gets or sets Visibility of X-axis labels.

    To hide the x-axis labels, set XAxisLabelVisibility to collapsed.

    this.chart.xAxisLabelVisibility="collapsed";
    
    <IgrCategoryChart
    xAxisLabelVisibility="collapsed"
    dataSource={this.state.data}>
    </IgrCategoryChart>

    Returns Visibility

  • set xAxisLabelVisibility(v): void
  • Parameters

    • v: Visibility

    Returns void

  • get xAxisMajorStroke(): string
  • Gets or sets the color to apply to major gridlines along the X-axis.

    Set XAxisMajorStroke to control the color of major gridlines extending vertically from the x-axis.

    this.chart.xAxisMajorStroke="green";
    
    <IgrCategoryChart
    xAxisMajorStroke="green"
    dataSource={this.state.data} >
    </IgrCategoryChart>

    Returns string

  • set xAxisMajorStroke(v): void
  • Parameters

    • v: string

    Returns void

  • get xAxisMajorStrokeThickness(): number
  • Gets or sets the thickness to apply to major gridlines along the X-axis.

    Set XAxisMajorStrokeThickness to control the thickness of major gridlines extending vertically from the x-axis.

    this.chart.xAxisMajorStrokeThickness="3" ;
    
    <IgrCategoryChart
    xAxisMajorStrokeThickness="3"
    xAxisExtent ={250}
    dataSource={this.state.data}
    chartType="stepArea" >
    </IgrCategoryChart>

    Returns number

  • set xAxisMajorStrokeThickness(v): void
  • Parameters

    • v: number

    Returns void

  • get xAxisMaximumValue(): Date
  • Gets or sets maximum value on x-axis

    Returns Date

  • set xAxisMaximumValue(v): void
  • Parameters

    • v: Date

    Returns void

  • get xAxisMinimumValue(): Date
  • Gets or sets minimum value on x-axis

    Returns Date

  • set xAxisMinimumValue(v): void
  • Parameters

    • v: Date

    Returns void

  • get xAxisMinorStroke(): string
  • Gets or sets the color to apply to minor gridlines along the X-axis.

    Set XAxisMinorStroke to control the color of minor gridlines extending vertically from the x-axis.

    this.chart.xAxisExtent="250";
    
    <IgrCategoryChart
    xAxisMinorStroke="green"
    dataSource={this.state.data}>
    </IgrCategoryChart>

    Returns string

  • set xAxisMinorStroke(v): void
  • Parameters

    • v: string

    Returns void

  • get xAxisMinorStrokeThickness(): number
  • Gets or sets the thickness to apply to minor gridlines along the X-axis.

    Set XAxisMinorStrokeThickness to control the thickness of minor gridlines extending vertically from the x-axis.

    this.chart.xAxisMinorStrokeThickness="3";
    
    <IgrCategoryChart
    xAxisMinorStrokeThickness="3"
    dataSource={this.state.data} >
    </