Web Components Charts API
The Ignite UI for Web Components charts provide simple and easy to use APIs to plot your data in IgcCategoryChartComponent
, IgcFinancialChartComponent
, IgcDataChartComponent
, IgcDataPieChartComponent
, IgcDoughnutChartComponent
, IgcPieChartComponent
, and IgcSparklineComponent
UI elements.
Web Components Category Chart API
The Web Components IgcCategoryChartComponent
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 |
Web Components Financial Chart API
The Web Components IgcFinancialChartComponent
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 |
Web Components Data Chart API
The Web Components IgcDataChartComponent
has the following API members:
Chart Properties | Axis Classes |
---|---|
- chartTitle - subtitle - isHorizontalZoomEnabled - isVerticalZoomEnabled - brushes - outlines - markerBrushes - markerOutlines - XamDataChart.Axes - IgcSeriesComponent |
- IgcAxisComponent is base class for all axis types - IgcCategoryXAxisComponent used with Category Series, Stacked Series, and Financial Series - IgcCategoryYAxisComponent used with Category Series, Stacked Series - IgcCategoryAngleAxisComponent used with Radial Series - IgcNumericXAxisComponent used with Scatter Series and Bar Series - IgcNumericYAxisComponent used with Scatter Series, Category Series, Stacked Series, and Financial Series - IgcNumericAngleAxisComponent used with Polar Series - IgcNumericRadiusAxisComponent used with Polar Series and Radial Series - IgcTimeXAxisComponent used with Category Series and Financial Series |
The Web Components IgcDataChartComponent
can use the following type of series that inherit from IgcSeriesComponent
:
Web Components Data Legend API
The Web Components IgcDataLegendComponent
has the following API members:
includedColumns
excludedColumns
includedSeries
excludedSeries
valueFormatAbbreviation
valueFormatMode
valueFormatCulture
valueFormatMinFractions
valueFormatMaxFractions
valueTextColor
titleTextColor
labelTextColor
unitsTextColor
summaryType
headerTextColor
badgeShape
Web Components Donut Chart API
The Web Components IgcDoughnutChartComponent
has the following API members:
Web Components Data Pie Chart API
The Web Components IgcDataPieChartComponent
has the following API members:
chartType
highlightingBehavior
othersCategoryThreshold
othersCategoryType
selectionMode
selectionBehavior
Web Components Pie Chart API
The Web Components IgcPieChartComponent
has the following API members:
legendItemBadgeTemplate
legendItemTemplate
legendLabelMemberPath
othersCategoryThreshold
othersCategoryType
selectionMode
Web Components Sparkline Chart API
The Web Components IgcSparklineComponent
has the following API members:
displayNormalRangeInFront
displayType
lowMarkerBrush
lowMarkerSize
lowMarkerVisibility
normalRangeFill
unknownValuePlotting
Additional Resources
You can find more information about charts in these topics: