Click handler?

[lekoaf]

I decided to see if I could just replace react-chartjs-2 with this library.

Most things worked smoothly, but it seems like this library doesn't support click handlers? Might just be me that's missing something.

This is my chart with react-chartjs-2.

<Bar
	getElementAtEvent={handleClick}
	data={{
		labels,
		datasets: [{ data }]
	}}
	options={barOptions}
/>

The getElementAtEvent doesn't seem to have an equivalence in this library?

This my click handler:

 /**
   * Extracting the label is the only way we can know what has been
   * clicked. Therefore we need to get it from the click event for
   * each bar and compute what properties should be used for filtering.
   *
   * The entire chart is clickable, that's why we return early if we didn't
   * get any data, which indicates we clicked a bar.
   */
  const handleClick = useCallback(
    (datasets: Array<IDataSets>) => {
      if (datasets.length === 0 || datasets[0]._model === undefined) {
        return
      }

      const { label } = datasets[0]._model

      if (label !== undefined) {
        setFilterValue(getFilterValue(label))
        setClicked()
      }
    },
    [setClicked]
  )

Maybe all of this can be solved in a better way?

[xr0master]

@lekoaf I think you can use the options events from the Chart.js, what do you think? https://www.chartjs.org/docs/next/general/interactions/events

In any case, you are right and it is worth adding API support. Or at least give access to the chart instance.

[lekoaf]

That seems like it could potentially work. I'll look in to that. Thanks. :+1: