Class IgrGeographicMap<SS>

Represents the Infragistics IgxGeographicMapComponent control.

Type parameters

  • SS

Hierarchy

Constructors

Properties

Accessors

Methods

Constructors

constructor

Properties

actualContentHitTestMode

actualContentHitTestMode: ChartHitTestMode

Resolved method of hit testing used when the pointer is over elements in the chart.

let actualContentHitTestMode: ChartHitTestMode  =this.chart.actualContentHitTestMode;

actualInteractionPixelScalingRatio

actualInteractionPixelScalingRatio: number

Resolved method of pixel scaling to use during end user interaction with the chart.

let actualInteractionPixelScalingRatio: number = this.chart.actualInteractionPixelScalingRatio;

actualPixelScalingRatio

actualPixelScalingRatio: number

Gets the resolved pixel scaling ratio.

A higher scaling ratio will produce crisper visuals at the expense of memory. Lower values will cause the control to appear blurry

let actualPixelScalingRatio: number = this.chart.actualPixelScalingRatio;

actualSeries

actualSeries: IgrSeries[] = []

The series actually present in the chart. Do not directly modify this array. This array's contents can be modified by causing React to reproject the child content. Or adding and removing series from the manual series collection on the series property.

actualWindowPositionHorizontal

actualWindowPositionHorizontal: number

A number between 0 and 1 determining the position of the horizontal scroll. This property is effectively a shortcut to the Left of the ActualWindowRect property.

let actualWindowPositionHorizontal: number = this.chart.actualWindowPositionHorizontal;

actualWindowPositionVertical

actualWindowPositionVertical: number

A number between 0 and 1 determining the position of the vertical scroll. This property is effectively a shortcut to the Top of the ActualWindowRect property.

let actualWindowPositionVertical: number = this.chart.actualWindowPositionVertical;
``

actualWindowRect

actualWindowRect: IgRect

Gets the actual value of the window rectangle, which represents the current zoom level.

actualWindowRectChanged

actualWindowRectChanged: function

Raised when the actual window rectangle of the SeriesViewer changes.

Type declaration

    • (s: IgrSeriesViewer, e: IgrRectChangedEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrRectChangedEventArgs

      Returns void

animateSeriesWhenAxisRangeChanges

animateSeriesWhenAxisRangeChanges: boolean

Gets or sets whether the series animations should be allowed when a range change has been detected on an axis.

animateSeriesWhenAxisRangeChanges is a Boolean property to override the default behavior in which series do not animate if an axis range changes.

this.chart.animateSeriesWhenAxisRangeChanges = true;
 <IgrDataChart
    dataSource={this.state.dataSource}
    animateSeriesWhenAxisRangeChanges={true}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrColumnSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

autoMarginHeight

autoMarginHeight: number

Sets or gets the automatic height to add when automatically adding margins to the chart.

 this.chart.autoMarginHeight = 50;
 <IgrDataChart
    autoMarginHeight={50}
    dataSource={this.state.dataSource} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrAreaSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

autoMarginWidth

autoMarginWidth: number

Sets or gets the automatic width to add when automatically adding margins to the chart.

The autoMarginWidth propertry is used find the automatic width to add when automatically adding margins to the chart.

this.chart.autoMarginWidth = 50;
 <IgrDataChart
    dataSource={this.state.dataSource}
    autoMarginWidth={50} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrColumnSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

bottomMargin

bottomMargin: number

Sets or gets the bottom margin to use around the chart content.

The bottomMargin property is used to gets/set the bottom margin around the chart content in the canvas.

this.chart.bottomMargin = 50;
 <IgrDataChart
    dataSource={this.state.dataSource}
     bottomMargin={50} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrColumnSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

chartTitle

chartTitle: string

Text to display above the plot area.

The chartTitle property is used to set the title to display for the component.

this.chart.title="Items Sold";
 <IgrDataChart
    dataSource={this.state.dataSource}
    title="Items Sold" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

contentHitTestMode

contentHitTestMode: ChartHitTestMode

Determines the method of hit testing used when mousing over elements in the chart.

this.chart.contentHitTestMode = ChartHitTestMode.Computational;

contentSeries

contentSeries: IgrSeries[] = []

contentViewport

contentViewport: IgRect

Represents the subset area within the viewport into which content should be mapped. This is the projection of the current EffectiveViewport into the viewport at current zoom level.

crosshairPoint

crosshairPoint: IgPoint

Gets or sets the cross hair point (in world coordinates) Either or both of the crosshair point's X and Y may be set to double.NaN, in which case the relevant crosshair line is hidden.

The crosshairPoint property is used to gets/sets the cross hair point (in world coordinates).

this.chart.crosshairPoint = {x:.8,y:.2};
 <IgrDataChart
    dataSource={this.state.dataSource}
    crosshairVisibility="visible"
    crosshairPoint={x:.8,y:.2} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrAreaSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

crosshairVisibility

crosshairVisibility: Visibility

Gets or sets the current SeriesViewer's crosshair visibility override.

The crosshairVisibility property is used to gets or sets the current Chart's crosshair visibility override. Note: setting this property does not affect the mobile browser version of the chart.

this.chart.crosshairVisibility = Visibility.Visible;
 <IgrDataChart
    dataSource={this.state.dataSource}
    crosshairVisibility="visible"
    crosshairPoint={x:.8,y:.2} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrAreaSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

defaultInteraction

defaultInteraction: InteractionState

Gets or sets the DefaultInteraction property. The default interaction state defines the SeriesViewer's response to mouse events.

The default interaction state defines the chart's response to mouse events.

this.chart.defaultInteraction = InteractionState.DragPan;
 <IgrDataChart
    dataSource={this.state.dataSource}
    defaultInteraction="dragPan" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrAreaSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

dragModifier

dragModifier: ModifierKeys

Gets or sets the current SeriesViewer's DragModifier property.

dragModifier is useful to enable zooming when zooming is not the default interaction.

this.chart.dragModifier = ModifierKeys.Alt;
 <IgrDataChart
    dataSource={this.state.dataSource}
    isHorizontalZoomEnabled=true
    defaultInteraction="dragPan"
    dragModifier="alt" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

effectiveViewport

effectiveViewport: IgRect

Gets the EffectiveViewport rectangle, representing the effective viewport area after margins have been subtracted.

ts let viewport: IgxRect = this.chart.effectiveViewport;

gridAreaRectChanged

gridAreaRectChanged: function

Occurs just after the current SeriesViewer's grid area rectangle is changed. The grid area may change as the result of the SeriesViewer being resized, or of an axis being added or changing size, possibly in another SeriesViewer.

Type declaration

    • (s: IgrSeriesViewer, e: IgrRectChangedEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrRectChangedEventArgs

      Returns void

highlightingTransitionDuration

highlightingTransitionDuration: number

Gets or sets the duration the highlighting/de-highlighting effects.

The highlightingTransitionDuration property is used to set the time for highlighting transition in milliseconds .

chart.HighlightingTransitionDuration=500;
 <IgrDataChart
    dataSource={this.state.dataSource}
    HighlightingTransitionDuration={500} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrAreaSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

interactionPixelScalingRatio

interactionPixelScalingRatio: number

Method of pixel scaling to use during end user interaction with the chart.

isAntiAliasingEnabledDuringInteraction

isAntiAliasingEnabledDuringInteraction: boolean

Gets or sets the IsAntiAliasingEnabledDuringInteraction property.

isPagePanningAllowed

isPagePanningAllowed: boolean

Gets or sets the whether the series viewer can allow the page to pan if a control pan is not possible in the requested direction.

isSurfaceInteractionDisabled

isSurfaceInteractionDisabled: boolean

Gets or sets whether all surface interactions with the plot area should be disabled.

The isSurfaceInteractionDisabled property is used to enable/disable interactions with the plot surface.

chart.isSurfaceInteractionDisabled=true;
 <IgrDataChart
    dataSource={this.state.dataSource}
     isSurfaceInteractionDisabled={true} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrAreaSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
    brush="Gray"
    outline="Black" />
 </IgrDataChart>

leftMargin

leftMargin: number

Sets or gets the left margin to use around the chart content.

The leftMargin property is used to set the left margin.

 this.chart.leftMargin = 20;
 <IgrDataChart
    dataSource={this.state.dataSource}
     leftMargin={20} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value"
/>
 </IgrDataChart>

panModifier

panModifier: ModifierKeys

Gets or sets the current SeriesViewer's PanModifier property.

panModifier is useful to enable panning when panning is not the default interaction.

this.chart.panModifier = ModifierKeys.Alt;
 <IgrDataChart
    dataSource={this.state.dataSource}
    isHorizontalZoomEnabled=true
    defaultInteraction="dragZoom"
    panModifier="alt" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

pixelScalingRatio

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.

plotAreaBackground

plotAreaBackground: string

Gets or sets the brush used as the background for the current SeriesViewer object's plot area.

plotAreaBackground property set the background brush to the current Chart object's plot area.

this.chart.plotAreaBackground="#F0F8FF";
 <IgrDataChart
    dataSource={this.state.dataSource}
    plotAreaBackground="#F0F8FF" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

preferHigherResolutionTiles

preferHigherResolutionTiles: boolean

Gets or sets whether the series viewer should prefer selecting higher resolution tiles over lower resolution tiles when performing tile zooming. Setting this to true will lower performance but increase quality.

previewRect

previewRect: IgRect

Gets or sets the preview rectangle. The preview rectangle may be set to Rect.Empty, in which case the visible preview strokePath is hidden.

previewRect can be used to highlight an area of importance.

this.chart.previewRect = {left:0,top:0,height:.5,width:.5};

refreshCompleted

refreshCompleted: function

Raised when the SeriesViewer's processing for an update has completed.

Type declaration

    • (s: IgrSeriesViewer, e: IgrRefreshCompletedEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrRefreshCompletedEventArgs

      Returns void

rightButtonDefaultInteraction

rightButtonDefaultInteraction: InteractionState

Gets or sets the RightButtonDefaultInteraction property. The default interaction state defines the SeriesViewer's response to right button mouse events.

rightMargin

rightMargin: number

Sets or gets the right margin to use around the chart content.

The rightMargin property is used to set the left margin around the chart content in the canvas.

this.chart.rightMargin=20;
 <IgrDataChart
    dataSource={this.state.dataSource}
    leftMargin= {20}
    rightMargin={20}
    topMargin={30}
    bottomMargin={20} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

seriesCursorMouseMove

seriesCursorMouseMove: function

Occurs when the cursors are moved over a series in this SeriesViewer.

Type declaration

    • (s: IgrSeriesViewer, e: IgrChartCursorEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrChartCursorEventArgs

      Returns void

seriesMouseEnter

seriesMouseEnter: function

Occurs when the mouse pointer enters a Series.

The SeriesMouseEnter event occurs when the left mouse pointer enters an element of this chart.

<-- position: content member-->

public onSeriesMouseEnter(event: {sender: any, args: ChartMouseEventArgs})
{
    var item = event.args.item;
}
 <IgrDataChart
    dataSource={this.state.dataSource}
    seriesMouseEnter={this.onSeriesMouseEnter}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

Type declaration

    • (s: IgrSeriesViewer, e: IgrChartMouseEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrChartMouseEventArgs

      Returns void

seriesMouseLeave

seriesMouseLeave: function

Occurs when the mouse pointer leaves a Series.

The SeriesMouseLeave event occurs when the left mouse pointer leaves an element of this chart.

public onSeriesMouseLeave(event: {sender: any, args: ChartMouseEventArgs})
{
    var item = event.args.item;
}
 <IgrDataChart
    dataSource={this.state.dataSource}
     seriesMouseLeave ={this.onSeriesMouseLeave}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

Type declaration

    • (s: IgrSeriesViewer, e: IgrChartMouseEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrChartMouseEventArgs

      Returns void

seriesMouseLeftButtonDown

seriesMouseLeftButtonDown: function

Occurs when the left mouse button is pressed while the mouse pointer is over a Series.

The SeriesMouseLeftButtonDown event occurs when the left mouse button is pressed while the mouse pointer is over an element of this chart.

<-- position: content member-->

public onSeriesMouseLeftButtonDown(event: {sender: any, args: DataChartMouseButtonEventArgs})
{
    var item = event.args.item;
}
 <IgrDataChart
    dataSource={this.state.dataSource}
    seriesMouseLeftButtonDown= {this.onSeriesMouseLeftButtonDown}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

Type declaration

    • (s: IgrSeriesViewer, e: IgrDataChartMouseButtonEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrDataChartMouseButtonEventArgs

      Returns void

seriesMouseLeftButtonUp

seriesMouseLeftButtonUp: function

Occurs when the left mouse button is released while the mouse pointer is over a Series.

The SeriesMouseLeftButtonUp event occurs when the left mouse button is released while the mouse pointer is over an element of this chart.

<-- position: content member-->

<-- position: content member-->

public onSeriesMouseLeftButtonUp(event: {sender: any, args: DataChartMouseButtonEventArgs})
{
    var item = event.args.item;
}
 <IgrDataChart
    dataSource={this.state.dataSource}
    seriesMouseLeftButtonUp ={this.onSeriesMouseLeftButtonUp}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>
public onSeriesMouseLeftButtonUp =(event: any, args: DataChartMouseButtonEventArgs )
{

}

Type declaration

    • (s: IgrSeriesViewer, e: IgrDataChartMouseButtonEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrDataChartMouseButtonEventArgs

      Returns void

seriesMouseMove

seriesMouseMove: function

Occurs when the mouse pointer moves while over a Series.

The SeriesMouseMove event occurs when the left mouse pointer moves while over an element of this chart.

<-- position: content member-->

<-- position: content member-->

public onSeriesMouseMove(event: {sender: any, args: ChartMouseEventArgs})
{
    var item = event.args.item;
}
 <IgrDataChart
    dataSource={this.state.dataSource}
    seriesMouseMove={this.onSeriesMouseMove} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>
public onSeriesMouseMove =( event: any, args: ChartMouseEventArgs) => {
                 }

Type declaration

    • (s: IgrSeriesViewer, e: IgrChartMouseEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrChartMouseEventArgs

      Returns void

sizeChanged

sizeChanged: function

Occurs after the size of the series viewer changes.

<-- position: content member-->

<-- position: content member-->

 <IgrDataChart
    dataSource={this.state.dataSource}
    sizeChanged={this.onSizeChanged=} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>
public onSizeChanged =(event: any, args: RectChangedEventArgs}){

}

Type declaration

    • (s: IgrSeriesViewer, e: IgrRectChangedEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrRectChangedEventArgs

      Returns void

subtitle

subtitle: string

Gets or sets the Subtitle property. The Title property defines the Subtitle of the chart

The subtitle property is used to display subtitle for the component.

this.chart.subtitle="Date of Sale: 1/1/2018";
 <IgrDataChart
    dataSource={this.state.dataSource}
    subtitle="Date of Sale: 1/1/2018" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

subtitleBottomMargin

subtitleBottomMargin: number

Margin applied below the subtitle.

The subtitleBottomMargin property is used to set the bottom margin for the subtitle.

this.chart.subtitleBottomMargin = 20;
 <IgrDataChart
    dataSource={this.state.dataSource}
     subtitleBottomMargin={20} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

subtitleHorizontalAlignment

subtitleHorizontalAlignment: HorizontalAlignment

Gets or sets the SubtitleHorizontalAlignment property.

The subtitleBottomMargin property is used to set the horizontal alignment for the subtitle.

this.chart.subtitleHorizontalAlignment="left";
 <IgrDataChart
    dataSource={this.state.dataSource}
    subtitleHorizontalAlignment="left"    >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

subtitleLeftMargin

subtitleLeftMargin: number

Margin applied to the left of the subtitle.

The subtitleLeftMarging property is used to set the left margin for the subtitle.

this.chart.subtitleLeftMarging=10;
 <IgrDataChart
    dataSource={this.state.dataSource}
    subtitleLeftMarging= {10}
    subtitleTopMargin={10}
    subtitleRightMargin={10}
    subtitleBottomMargin={20}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

subtitleRightMargin

subtitleRightMargin: number

Margin applied to the right of the subtitle.

The subTitleRightMargin property is used to set the right margin for the subtitle.

this.chart.subtitleLeftMarging=10;
 <IgrDataChart
    dataSource={this.state.dataSource}
    subtitleLeftMarging= {10}
    subtitleTopMargin= {10}
    subtitleRightMargin={10}
    subtitleBottomMargin={20} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

subtitleTextColor

subtitleTextColor: string

Gets or sets the Color used for the Subtitle Text.

The subtitleTextColor property is used to set the color for the subtitle.

this.chart.subtitleTextColor="blue";
 <IgrDataChart
    dataSource={this.state.dataSource}
    title="Date of Sale: 1/1/2018"
    subtitleTextColor="blue">

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

subtitleTextStyle

subtitleTextStyle: string

Font settings for the subtitle.

subtitleTopMargin

subtitleTopMargin: number

Margin applied above the subtitle.

The subtitleTopMargin property is used to set the top margin for the subtitle.

this.chart.subtitleTopMargin =10;
 <IgrDataChart
    dataSource={this.state.dataSource}
    subtitleLeftMarging= {10}
    subtitleTopMargin={10}
    subtitleRightMargin={10}
    subtitleBottomMargin={20}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

titleBottomMargin

titleBottomMargin: number

Margin applied below the title.

The titleBottomMargin property is used to set the bottom margin for the title.

this.chart.titleBottomMargin=20;
 <IgrDataChart
    dataSource={this.state.dataSource}
    title="Items Sold"
    titleLeftMarging= {10}
    titleTopMargin= {10 }
    titleRightMargin= {10}
    titleBottomMargin= {20}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

titleHorizontalAlignment

titleHorizontalAlignment: HorizontalAlignment

Gets or sets the TitleHorizontalAlignment property.

The subtitleHorizontalAlignment property is used to set horizontal alignment for the subtitle.

this.chart.titleHorizontalAlignment="left";
 <IgrDataChart
    dataSource={this.state.dataSource}
    titleHorizontalAlignment="left"
    subtitleHorizontalAlignment="left" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

titleLeftMargin

titleLeftMargin: number

Margin applied to the left of the title.

The titleLeftMarging property is used to set the left margin for the title.

this.chart.titleLeftMarging=10;
 <IgrDataChart
    dataSource={this.state.dataSource}
    title="Items Sold"
    titleLeftMarging={10}
    titleTopMargin={10}
    titleRightMargin={10}
    titleBottomMargin= {20} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

titleRightMargin

titleRightMargin: number

Margin applied to the right of the title.

The titleRightMargin property is used to set the right margin for the title.

this.chart.titleRightMargin=10;
 <IgrDataChart
    dataSource={this.state.dataSource}
    titleLeftMarging= {10}
    titleTopMargin= {10 }
    titleRightMargin= {10}
    titleBottomMargin= {20} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

titleTextColor

titleTextColor: string

Gets or sets the Color used for the Title Text.

The titleTextColor property is used to set the title brush.

this.chart.titleTextColor="blue" ;
 <IgrDataChart
    dataSource={this.state.dataSource}
    titleTextColor="blue" >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

titleTextStyle

titleTextStyle: string

Font settings for the title.

titleTopMargin

titleTopMargin: number

Margin applied above the title.

The titleTopMargin property is used to set the top margin for the title.

this.chart.titleTopMargin=10;
 <IgrDataChart
    dataSource={this.state.dataSource}
    titleLeftMarging= {10}
    titleTopMargin= {10 }
    titleRightMargin= {10}
    titleBottomMargin= {20}>

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

topMargin

topMargin: number

Sets or gets the top margin to use around the chart content.

The topMargin property is used to set the top margin.

this.chart.topMargin=30;
 <IgrDataChart
    dataSource={this.state.dataSource}
    leftMargin= {20}
    rightMargin={20}
    topMargin={30}
    bottomMargin= {20} >

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

useTiledZooming

useTiledZooming: boolean

Gets or sets whether the series viewer should use cached tiles during zooms rather than the default live content.

viewportRect

viewportRect: IgRect

Gets the viewport rectangle associated with the SeriesViewer, the physical dimensions of the plot area.

windowPositionHorizontal

windowPositionHorizontal: number

A number between 0 and 1 determining the position of the horizontal scroll. This property is effectively a shortcut to the X position of the WindowRect property.

this.chart.windowPositionHorizontal = .2;

windowPositionVertical

windowPositionVertical: number

A number between 0 and 1 determining the position of the vertical scroll. This property is effectively a shortcut to the Y position of the WindowRect property.

this.chart.windowPositionVertical = .2;

windowRect

windowRect: IgRect

A rectangle representing the portion of the SeriesViewer currently in view. A rectangle at X=0, Y=0 with a Height and Width of 1 implies the entire plotting area is in view. A Height and Width of .5 would imply that the view is halfway zoomed in.

You can set the windowRect to zoom in on an area of interest in the chart.

this.chart.windowRect = {left:0, top:1, width: .5, height: .5};

windowRectChanged

windowRectChanged: function

Occurs just after the current SeriesViewer's window rectangle is changed.

<-- position: content member-->

<-- position: content member-->

<IgrDataChart
    width="100%"
    height="100%"
    dataSource={this.data}
    windowRectChanged={this.onWindowRectChanged} >
<IgrCategoryXAxis name="xAxis" label="Year"/>
<IgrNumericYAxis name="yAxis" minimumValue={0} />
<IgrLineSeries name="series3" title="Russia"
    valueMemberPath="Russia"
    xAxisName="xAxis"
    yAxisName="yAxis"
    markerType={this.state.markersType} />
</IgrDataChart>
public onWindowRectChanged =( s:any, e: RectChangedEventArgs) => {

       }

Type declaration

    • (s: IgrSeriesViewer, e: IgrRectChangedEventArgs): void
    • Parameters

      • s: IgrSeriesViewer
      • e: IgrRectChangedEventArgs

      Returns void

windowRectMinWidth

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.

The windowRectMinWidth property is used to set or get the minimum width that the window rect is allowed to reach before being clamped.

this.chart.WindowRectMinWidth=".2";
 <IgrDataChart
    dataSource={this.state.dataSource}
    WindowRectMinWidth=".2">

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

windowResponse

windowResponse: WindowResponse

The response to user panning and zooming: whether to update the view immediately while the user action is happening, or to defer the update to after the user action is complete. The user action will be an action such as a mouse drag which causes panning and/or zooming to occur.

The windowResponse property is used to set the response to user panning and zooming: whether to update the view immediately while the user action is happening, or to defer the update to after the user action is complete. The user action will be an action such as a mouse drag which causes panning and/or zooming to occur.

this.chart.windowResponse="deferred";
 <IgrDataChart
    dataSource={this.state.dataSource}
    windowResponse="deferred">

    <IgrNumericXAxis name="xAxis" />
    <IgrNumericYAxis name="yAxis" />

    <IgrLineSeries
     name="series1"
    xAxisName="xAxis"
    yAxisName="yAxis"
    valueMemberPath="Value" />
 </IgrDataChart>

zoomTileCacheSize

zoomTileCacheSize: number

Gets or sets the maximum number of zoom tiles that the series viewer should cache while in tiled zooming mode.

Accessors

actualWindowScale

  • get actualWindowScale(): number
  • set actualWindowScale(v: number): void
  • A number between 0 and 1 determining the scale of the horizontal/vertical zoom. This property is effectively a shortcut to the Width/Height of the ActualWindowRect property.

    Returns number

  • A number between 0 and 1 determining the scale of the horizontal/vertical zoom. This property is effectively a shortcut to the Width/Height of the ActualWindowRect property.

    Parameters

    • v: number

    Returns void

actualWorldRect

  • get actualWorldRect(): IgRect
  • set actualWorldRect(v: IgRect): void
  • Gets the actual value of the WorldRect.

    Returns IgRect

  • Gets the actual value of the WorldRect.

    Parameters

    • v: IgRect

    Returns void

backgroundContent

  • An imagery to display behind all series, inside the viewport of the IgrGeographicMapComponent control.

    Returns IgrGeographicMapImagery

  • An imagery to display behind all series, inside the viewport of the IgrGeographicMapComponent control.

    Parameters

    Returns void

dataSource

  • get dataSource(): any
  • set dataSource(value: any): void
  • Returns any

  • Parameters

    • value: any

    Returns void

height

  • get height(): string
  • set height(value: string): void
  • Returns string

  • Parameters

    • value: string

    Returns void

imageTilesReady

  • get imageTilesReady(): function
  • set imageTilesReady(ev: function): void

isMap

  • get isMap(): boolean
  • Indicates if this SeriesViewer is a map.

    Returns boolean

legend

  • get legend(): any
  • set legend(v: any): void
  • Gets or sets the legend used for the current chart.

    Returns any

  • Gets or sets the legend used for the current chart.

    Parameters

    • v: any

    Returns void

resizeBehavior

  • Gets or sets the behavior to use during resize.

    Returns MapResizeBehavior

  • Gets or sets the behavior to use during resize.

    Parameters

    Returns void

series

  • get series(): IgrSeriesCollection
  • A collection or manually added series for the chart.

    Returns IgrSeriesCollection

width

  • get width(): string
  • set width(value: string): void
  • Returns string

  • Parameters

    • value: string

    Returns void

windowScale

  • get windowScale(): number
  • set windowScale(v: number): void
  • A number between 0 and 1 determining the scale of the horizontal/vertical zoom. This property is effectively a shortcut to the Width/Height of the WindowRect property.

    Returns number

  • A number between 0 and 1 determining the scale of the horizontal/vertical zoom. This property is effectively a shortcut to the Width/Height of the WindowRect property.

    Parameters

    • v: number

    Returns void

worldRect

  • get worldRect(): IgRect
  • set worldRect(v: IgRect): void
  • Gets or sets the world bounding rectangle.

    Returns IgRect

  • Gets or sets the world bounding rectangle.

    Parameters

    • v: IgRect

    Returns void

xAxis

  • get xAxis(): IgrNumericXAxis
  • set xAxis(v: IgrNumericXAxis): void
  • The X-axis for this IgxGeographicMap.Component Under normal circumstances, this property should not be set in application code. By default, it will be set to a numeric axis with a spherical mercator scaler.

    Returns IgrNumericXAxis

  • The X-axis for this IgxGeographicMap.Component Under normal circumstances, this property should not be set in application code. By default, it will be set to a numeric axis with a spherical mercator scaler.

    Parameters

    • v: IgrNumericXAxis

    Returns void

yAxis

  • get yAxis(): IgrNumericYAxis
  • set yAxis(v: IgrNumericYAxis): void
  • The Y-axis for this IgxGeographicMap.Component Under normal circumstances, this property should not be set in application code. By default, it will be set to a numeric axis with a spherical mercator scaler.

    Returns IgrNumericYAxis

  • The Y-axis for this IgxGeographicMap.Component Under normal circumstances, this property should not be set in application code. By default, it will be set to a numeric axis with a spherical mercator scaler.

    Parameters

    • v: IgrNumericYAxis

    Returns void

zoomIsReady

  • get zoomIsReady(): boolean
  • Gets whether or not the control is ready for zooming

    Returns boolean

zoomable

  • get zoomable(): boolean
  • set zoomable(v: boolean): void
  • Gets or sets zoomability of the current control

    Returns boolean

  • Gets or sets zoomability of the current control

    Parameters

    • v: boolean

    Returns void

Methods

Optional UNSAFE_componentWillMount

  • UNSAFE_componentWillMount(): void

Optional UNSAFE_componentWillReceiveProps

Optional UNSAFE_componentWillUpdate

  • UNSAFE_componentWillUpdate(nextProps: Readonly<IIgrGeographicMapProps>, nextState: Readonly<__type>, nextContext: any): void

attachSeries

  • attachSeries(s: IgrSeries): void
  • Attaches the given series to the chart.

    Parameters

    • s: IgrSeries
      • The series to attach to the chart.

    Returns void

bindData

  • bindData(): void
  • Returns void

clearTileCache

  • clearTileCache(): void
  • Removes all cached tile images from the map imagery assigned to the map's background content.

    Returns void

clearTileZoomCache

  • clearTileZoomCache(): void
  • Clears the tile zoom tile cache so that new tiles will be generated. Only applies if the viewer is using a tile based zoom.

    Returns void

Optional componentDidCatch

  • componentDidCatch(error: Error, errorInfo: ErrorInfo): void
  • Catches exceptions generated in descendant components. Unhandled exceptions will cause the entire component tree to unmount.

    Parameters

    • error: Error
    • errorInfo: ErrorInfo

    Returns void

componentDidMount

  • componentDidMount(): void
  • Returns void

Optional componentDidUpdate

  • componentDidUpdate(prevProps: Readonly<IIgrGeographicMapProps>, prevState: Readonly<__type>, snapshot?: SS): void
  • Called immediately after updating occurs. Not called for the initial render.

    The snapshot is only present if getSnapshotBeforeUpdate is present and returns non-null.

    Parameters

    Returns void

Optional componentWillMount

  • componentWillMount(): void

Optional componentWillReceiveProps

componentWillUnmount

  • componentWillUnmount(): void
  • Returns void

Optional componentWillUpdate

  • componentWillUpdate(nextProps: Readonly<IIgrGeographicMapProps>, nextState: Readonly<__type>, nextContext: any): void

convertGeographicToZoom

  • convertGeographicToZoom(geographic: IgRect, extraPixelPadding: number): IgRect
  • Parameters

    • geographic: IgRect
    • extraPixelPadding: number

    Returns IgRect

deferredRefresh

  • deferredRefresh(): void
  • Calls for a deferred refresh to the GeographicMap's background.

    Returns void

destroy

  • destroy(): void
  • Release any resources held by the control.

    Returns void

endTiledZoomingIfRunning

  • endTiledZoomingIfRunning(): void
  • Manually ends a tiled zoom if one is running.

    Returns void

exportVisualData

  • exportVisualData(): any
  • Returns the chart visuals expressed as a ChartVisualData object.

    Returns any

flush

  • flush(): void
  • Use to force the SeriesViewer to finish any deferred work before printing or evaluating its visual. This should only be called if the visual of the SeriesViewer needs to be synchronously saved or evaluated. Calling this method too often will hinder the performance of the SeriesViewer.

    this.chart.flush();

    Returns void

getActualWindowScaleHorizontal

  • getActualWindowScaleHorizontal(): number
  • Gets actual window scale for horizontal dimension of the control

    Returns number

getActualWindowScaleVertical

  • getActualWindowScaleVertical(): number
  • Gets actual window scale for vertical dimension of the control

    Returns number

getGeographicFromZoom

  • getGeographicFromZoom(windowRect: IgRect): IgRect
  • Given a WindowRect and the current plot area, get the geographic region represented by that WindowRect.

    Parameters

    • windowRect: IgRect
      • The zoom area.

    Returns IgRect

getGeographicPoint

  • getGeographicPoint(pixelCoordinate: IgPoint): IgPoint
  • Convert a pixel-based coordinate to a geographic coordinate.

    Parameters

    • pixelCoordinate: IgPoint
      • A pixel-based coordinate

    Returns IgPoint

getPixelPoint

  • getPixelPoint(geographicCoordinate: IgPoint): IgPoint
  • Convert a geographic coordinate to a pixel-based coordinate.

    Parameters

    • geographicCoordinate: IgPoint
      • A geographic coordinate

    Returns IgPoint

Optional getSnapshotBeforeUpdate

  • getSnapshotBeforeUpdate(prevProps: Readonly<IIgrGeographicMapProps>, prevState: Readonly<__type>): SS | null
  • Runs before React applies the result of render to the document, and returns an object to be given to componentDidUpdate. Useful for saving things such as scroll position before render causes changes to it.

    Note: the presence of getSnapshotBeforeUpdate prevents any of the deprecated lifecycle events from running.

    Parameters

    Returns SS | null

getWindowPoint

  • getWindowPoint(geographicCoordinate: IgPoint): IgPoint
  • Convert a geographic coordinate to a pixel-based coordinate.

    Parameters

    • geographicCoordinate: IgPoint
      • A geographic coordinate

    Returns IgPoint

getZoomFromGeographicPoints

  • getZoomFromGeographicPoints(northWest: IgPoint, southEast: IgPoint): IgRect
  • Parameters

    • northWest: IgPoint
    • southEast: IgPoint

    Returns IgRect

getZoomFromGeographicRect

  • getZoomFromGeographicRect(geographic: IgRect): IgRect
  • Given the current plot area of the control and a geographic region, get the WindowRect that would encompass that geographic region.

    Parameters

    • geographic: IgRect
      • The geographic area.

    Returns IgRect

getZoomRectFromGeoRect

  • getZoomRectFromGeoRect(geographic: IgRect): IgRect
  • Given the current plot area of the control and a geographic region, get the WindowRect that would encompass that geographic region.

    Parameters

    • geographic: IgRect
      • The geographic area.

    Returns IgRect

hideToolTip

  • hideToolTip(): void
  • Hides the active main tooltip, if displayed.

    this.chart.hideToolTip();

    Returns void

initializeContent

  • initializeContent(): void
  • Returns void

notifyClearItems

  • notifyClearItems(source_: any): void
  • Used to manually notify the SeriesViewer that the data source has reset or cleared its items. Invoking this method is only necessary if that datasource is not observable.

    Parameters

    • source_: any
      • The data source which was cleared or reset.
      this.chart.notifyClearItems(this.data);

    Returns void

notifyContainerResized

  • notifyContainerResized(): void
  • Notification from the containing object that the container has been resized.

    Returns void

notifyInsertItem

  • notifyInsertItem(source_: any, index: number, newItem: any): void
  • Parameters

    • source_: any
    • index: number
    • newItem: any

    Returns void

notifyRemoveItem

  • notifyRemoveItem(source_: any, index: number, oldItem: any): void
  • Parameters

    • source_: any
    • index: number
    • oldItem: any

    Returns void

notifySetItem

  • notifySetItem(source_: any, index: number, oldItem: any, newItem: any): void
  • Parameters

    • source_: any
    • index: number
    • oldItem: any
    • newItem: any

    Returns void

render

  • render(): DetailedReactHTMLElement<object, any>
  • Returns DetailedReactHTMLElement<object, any>

resetZoom

  • resetZoom(): void
  • Resets the zoom level to default.

    Returns void

shouldComponentUpdate

  • shouldComponentUpdate(nextProps: any, nextState: any): boolean
  • Parameters

    • nextProps: any
    • nextState: any

    Returns boolean

startTiledZoomingIfNecessary

  • startTiledZoomingIfNecessary(): void
  • Manually starts a tiled zoom if one isn't already running.

    Returns void

styleUpdated

  • styleUpdated(): void
  • Notifies the chart that the CSS styles in effect have been updated.

    Returns void

updateZoomWindow

  • updateZoomWindow(zoomWindow: IgRect): void
  • Parameters

    • zoomWindow: IgRect

    Returns void

zoomToGeographic

  • zoomToGeographic(geographic: IgRect): void
  • Zoom in to the geographic region specified, when possible (may need to wait for map to be initialized).

    Parameters

    • geographic: IgRect
      • The geographic region to zoom to.

    Returns void

Static _createFromInternal

  • _createFromInternal(internal: any): IgrSeriesViewer
  • Parameters

    • internal: any

    Returns IgrSeriesViewer