Accepted answer

From Highcharts API:


Reflows the chart to its container. By default, the chart reflows automatically to its container following a window.resize event, as per the chart.reflow option. However, there are no reliable events for div resize, so if the container is resized without a window resize event, this must be called explicitly.

As a solution, call reflow method after width change.

  useEffect(() => {
    const chart = chartComponent.current?.chart;

    if (chart) chart.reflow(false);
  }, [width]);

Live demo:

API Reference:

Related Query

More Query from same tag