[Enhancement] Chart Click events

[netclectic]

It would be nice to have OnClick/OnDataPointClick events exposed on the charts to allow a more interactive experience and enable drilling down into the underlying data.

[mathewtaylor]

Done in #520, merged to develop for the next release.

OnDataPointClick and OnChartClick are on BbChartBase, so every chart type has them — bar, line, area, pie, scatter, candlestick and the rest.

OnDataPointClick gives you a ChartClickEventArgs with SeriesName, SeriesIndex, DataIndex, Name, ComponentType and the value. DataIndex is the one for drill-down — it maps straight back to the position in the collection you bound.

The value is split rather than handed over raw. ECharts reports it as whatever the series put there — a number for a bar, an array for scatter or candlestick — so Value carries the scalar case and Values the array case. That way the two common shapes arrive typed instead of as a JsonElement you have to unpick.

OnChartClick fires when the click landed away from any data point, for clearing a selection. The two never both fire for one click.

Worth recording for anyone reading the code later: detecting a blank click via chart.containPixel('grid', point) does not work. That is true anywhere inside the plot area, including the gaps between bars, so it suppressed nearly every blank click. It checks zrender's event.target instead, which is set only when the click lands on a rendered shape.

No interop is set up unless one of the callbacks has a handler, so charts without them cost nothing extra.

There is a worked example on the Bar Chart demo page.

[mathewtaylor]

Released in BlazorBlueprint.Components 3.16.1, live on NuGet now.

dotnet add package BlazorBlueprint.Components --version 3.16.1

Please reopen, or open a new issue, if it is not behaving as described.