Echarts automatic resizing method

  • Every time the browser window changes, echarts will not automatically adjust the chart window size by default
  • In fact, echarts provides a method of resizing resize, which is also very convenient to use
  • Take react+echarts as an example:
// newChart是创建的新Echarts图表
useEffect(() => {
    
    
  const handleResize = window.addEventListener('resize', function () {
    
    
    newChart?.resize();
  });

  return () => {
    
    
    window.removeEventListener('resize', handleResize);
  };
}, [newChart]);
  • You only need to call the method provided by Echarts in the callback function that monitors window changes resize, and that’s it.

Guess you like

Origin blog.csdn.net/weixin_44733660/article/details/129235489