vue3+百度 echarts 高度和宽度自适应的优化

echart在切换table签或者视窗放大和缩小的时候echart不能实时的变更尺寸,那么我们只需要在dom变化的时候调用echart.resize()就行了

onMounted(() => {
            myEchar = echarts.init(document.getElementById(state.chartId));
            setOptions();//设置参数
            domChange();//
 })
/**
* 监听元素变化
 */
 const domChange =()=> {
            let selfChart = document.getElementById(state.chartId);
            state.observer = new ResizeObserver(() => {
                myEchar.resize();//ecahrts重置尺寸
            });
            state.observer.observe(selfChart); // 监听元素
}




你可能感兴趣的:(前端,javascript,echarts)