React Common - Click Handling
This topic explains how to handle user clicks. To learn about hover and selection, refer to the Hover Handling and Selection Handling topics, respectively.
Series Click
You can handle a series click. To do this, implement a callback function and assign it to the chart's onSeriesClick option.
var chartOptions = { onSeriesClick: function (info) { //... } };
The onSeriesClick callback function accepts an object that contains information on the click event. Fields of this object are described in the onSeriesClick option description. Among these fields, you can find the clicked series. An object that represents this series is described in the Series section.
Point Click
You can handle the click on a data point of any type (point, bar, pie slice, etc.). To do this, implement a callback function and assign it to the onPointClick option of the chart's configuration object.
var chartOptions = { onPointClick: function(info){ //... } };
The onPointClick callback function accepts an object that contains information on the click event. Fields of this object are described in the onPointClick option description of Chart and PieChart. Among these fields, you can find the clicked point. An object that represents this point is described in the Point section.
Legend Click
In addition to a click on a point or a series, you can handle a click on a legend item. To do this, implement a callback function and assign it to the onLegendClick option of the chart's configuration object.
var chartOptions = { onLegendClick: function(info) { //... } };
The onLegendClick callback function accepts an object that contains information on the legend click event. Fields of this object are described in the onLegendClick option description of Chart and PieChart. Among these fields, you can find the series (in Chart) or the argument of the points (in PieChart) that correspond to the clicked legend item.
If you have technical questions, please create a support ticket in the DevExpress Support Center.