Echarts自动调整大小方法

  • 每次浏览器窗口变化的时候,echarts默认情况下不会自动调整图表窗口大小
  • 其实echarts提供了调整大小的方法resize,使用起来也很方便
  • 以react+echarts为例:
// newChart是创建的新Echarts图表
useEffect(() => {
    
    
  const handleResize = window.addEventListener('resize', function () {
    
    
    newChart?.resize();
  });

  return () => {
    
    
    window.removeEventListener('resize', handleResize);
  };
}, [newChart]);
  • 只需要在监听窗口变化的回调函数里调用Echarts提供的resize方法,就可以了

猜你喜欢

转载自blog.csdn.net/weixin_44733660/article/details/129235489
今日推荐