[Chartjs]-Removing chart on click event produces 'removeHoverStyle' of null error

0👍

I am on react 16.12 with react-chartjs-2 2.9.0. I have found that the chart itself has the property "onElementsClick" that you can set a function to handle showing of the chart based on a property in a parent component. This way you don’t have to do any kind of weird hacks like randomly delaying execution of code.

For example:

import React from 'react';
import { Line } from 'react-chartjs-2';

const chartComponent = (props) => {
  return (
      <Line onElementsClick={props.handleShow} ..... />
  );
}

-1👍

I have exact same issue, and I figured out that we are not supposed to modify chart within onClick event handler, and the solution is

        window.setTimeout(function () {
            if (ref.current) {
                ref.current.chartInstance.destroy();
            }
            history.push(`/eod/${date}`);
        }, 1);

Leave a comment