Web Components Chart Tooltips
In Web Components charts, tooltips provide details about bound data and they are rendered in popups when the end-user hovers over data points. Tooltips are supported by the
Web Components Chart Tooltip Types
Web Components Chart provide three types of tooltips that you can with tooltips enabled by setting the
toolTipType property. The following example shows the Column Chart with a combo-box that you can use to change type of tooltips.
toolTipType property is configurable and can be set to one of the following options:
||Display a tooltip for a single item when the pointer is positioned over it.|
||Display the data tooltips for all series in the chart.|
||Display a tooltip for each data item in the category that the pointer is positioned over.|
||Display a grouped tooltip for all data points in the category that the pointer is positioned over.|
Web Components Chart Tooltip Template
If none of built-in types of tooltips are matching your requirements, you can create your own tooltips to display and style series title, data values, and axis values. The following sections demonstrate how to do this in different types of Web Components charts.
Custom Tooltips in Category Chart
This example shows how to create custom tooltips for all series in Web Components
IgcCategoryChartComponent control. Note that you can also apply the same logic to custom tooltips in Web Components
Custom Tooltips in Data Chart
This example shows how to create custom tooltips for each series in Web Components Data Chart control.
You can find more information about related chart features in these topics:
The following is a list of API members mentioned in the above sections:
IgcDataChartComponent component, you can use the following API components and properties: