[Solved]-Line chart is not being displayed in Chart.js-Chart.js

Looks like your isRebuildingCanvas logic might be inconsistent, or I don't just understand it.

Anyway, from the Chart.js perspective, you'd want to change the data and call chartInstance.update() when pressing the button that changes the data.

Partial example:

  const canvas = useRef(null);
  const [chart, setChart] = useState();
  const [timeFormat, setTimeFormat] = useState("24h");

  useEffect(() => {
    if (chart || !canvas.current) return;
    const ctx = canvas.current.getContext("2d");
    if (!ctx) return;

    const config = {/*...*/};

    setChart(new Chart(ctx, config));
  }, [chart, canvas]);

  useEffect(() => {
    if (!chart) return;

    chart.config.data.datasets[0].data = determineTimeFormat(timeFormat, day, week, year);
    chart.update();
  }, [chart, timeFormat]);

And a complete, very similar example: https://codesandbox.io/s/blissful-faraday-hzcq0