echarts超出父容器范围和自适应的解决办法
2022-01-25 本文已影响0人
幽小鬼
给echarts图表设置100%
宽高,父容器动态设置一个宽高时,echarts图表会占满不了父容器或者溢出父容器范围。
产生问题的原因是因为echarts图形只绘制一次,且绘制时自动获取父级大小填写宽度,然后改变容器宽高,导致echarts绑定的元素的宽度并不是最终的宽度,所以造成了获取到的结果并不是想要的。
解决办法是延迟加载,等父容器设置完宽高以后echarts再进行渲染:
mounted () {
setTimeout(() => {
this.initChart() // 绘制图表
}, 0)
}