echarts超出父容器范围和自适应的解决办法

2022-01-25  本文已影响0人  幽小鬼

给echarts图表设置100%宽高,父容器动态设置一个宽高时,echarts图表会占满不了父容器或者溢出父容器范围。

产生问题的原因是因为echarts图形只绘制一次,且绘制时自动获取父级大小填写宽度,然后改变容器宽高,导致echarts绑定的元素的宽度并不是最终的宽度,所以造成了获取到的结果并不是想要的。

解决办法是延迟加载,等父容器设置完宽高以后echarts再进行渲染:

mounted () {
        setTimeout(() => {
            this.initChart() // 绘制图表
        }, 0)
    }
上一篇下一篇

猜你喜欢

热点阅读