echarts可视化,页面尺寸变化时,echarts随着改变加防抖

发布时间 2023-04-10 15:50:20作者: IT小兔

const container = document.querySelector('.charts')

1、不需要跟新数据

 window.addEventListener("resize", () => {
      container.resize();
});

2、需要更新数据

function debounce(fn, duration = 300){

  let timerid //记录上一次的计时id

  return function (...args){

    if(timerid){clearTimeout(timerid)}

    timerid = setTimeout(()=>{

      fn.apply(this,...args)

    }, duration )

  }

}

const newUpdateChart = debounce(updateChart)

const handler = () => {

  newUpdateChart(container) //更新数据

  resizeChart()//重新设置图表尺寸

}

window.addEventListener('resize', handler)