React Charts API
The Ignite UI for React charts provide simple and easy to use APIs to plot your data in IgrCategoryChart
, IgrFinancialChart
, IgrDataChart
, IgrDataPieChart
, IgrDoughnutChart
, IgrPieChart
, and IgrSparkline
UI elements.
React Category Chart API
The React IgrCategoryChart
has the following API members:
Chart Properties | Axis Properties | Series Properties |
---|---|---|
- chartType - excludedProperties - includedProperties - isHorizontalZoomEnabled - isVerticalZoomEnabled - crosshairsDisplayMode - transitionInMode - highlightingBehavior - highlightingMode - trendLineType |
- xAxisInterval - xAxisLabelLocation - xAxisGap - xAxisOverlap - xAxisTitle - yAxisInterval - yAxisLabelLocation - yAxisTitle - yAxisMinimumValue - yAxisMaximumValue |
- brushes - outlines - markerBrushes - markerOutlines - markerTypes - toolTipType |
React Financial Chart API
The React IgrFinancialChart
has the following API members:
Chart Properties | Axis Properties | Series Properties |
---|---|---|
- chartType - excludedProperties - includedProperties - isHorizontalZoomEnabled - isVerticalZoomEnabled - toolTipType - crosshairsDisplayMode - highlightingBehavior - highlightingMode - trendLineType |
- xAxisInterval - xAxisLabelLocation - xAxisTitle - yAxisInterval - yAxisLabelLocation - yAxisTitle - yAxisMinimumValue - yAxisMaximumValue - yAxisMode - xAxisMode |
- brushes - outlines - markerBrushes - markerOutlines - markerTypes - indicatorTypes - volumeType - zoomSliderType |
React Data Chart API
The React IgrDataChart
has the following API members:
Chart Properties | Axis Classes |
---|---|
- chartTitle - subtitle - isHorizontalZoomEnabled - isVerticalZoomEnabled - brushes - outlines - markerBrushes - markerOutlines - XamDataChart.Axes - IgrSeries |
- IgrAxis is base class for all axis types - IgrCategoryXAxis used with Category Series, Stacked Series, and Financial Series - IgrCategoryYAxis used with Category Series, Stacked Series - IgrCategoryAngleAxis used with Radial Series - IgrNumericXAxis used with Scatter Series and Bar Series - IgrNumericYAxis used with Scatter Series, Category Series, Stacked Series, and Financial Series - IgrNumericAngleAxis used with Polar Series - IgrNumericRadiusAxis used with Polar Series and Radial Series - IgrTimeXAxis used with Category Series and Financial Series |
The React IgrDataChart
can use the following type of series that inherit from IgrSeries
:
Radial Series | Polar Series |
---|---|
- IgrRadialLineSeries - IgrRadialAreaSeries - IgrRadialPieSeries - IgrRadialColumnSeries |
- IgrPolarScatterSeries - IgrPolarLineSeries - IgrPolarAreaSeries - IgrPolarSplineSeries - IgrPolarSplineAreaSeries |
React Data Legend API
The React IgrDataLegend
has the following API members:
includedColumns
excludedColumns
includedSeries
excludedSeries
valueFormatAbbreviation
valueFormatMode
valueFormatCulture
valueFormatMinFractions
valueFormatMaxFractions
valueTextColor
titleTextColor
labelTextColor
unitsTextColor
summaryType
headerTextColor
badgeShape
React Donut Chart API
The React IgrDoughnutChart
has the following API members:
React Data Pie Chart API
The React IgrDataPieChart
has the following API members:
chartType
highlightingBehavior
othersCategoryThreshold
othersCategoryType
selectionMode
selectionBehavior
React Pie Chart API
The React IgrPieChart
has the following API members:
legendItemBadgeTemplate
legendItemTemplate
legendLabelMemberPath
othersCategoryThreshold
othersCategoryType
selectionMode
React Sparkline Chart API
The React IgrSparkline
has the following API members:
displayNormalRangeInFront
displayType
lowMarkerBrush
lowMarkerSize
lowMarkerVisibility
normalRangeFill
unknownValuePlotting
Additional Resources
You can find more information about charts in these topics: