ECharts使用的bug记录和问题解决

ECharts使用中的bug记录及问题解决：

在使用Echarts的时候。总会碰到各种奇奇怪怪的问题：

例如：1、图表加载不出来；2、控制台报错或警告；
今天就仔细分析一下以上这种情况；

1、控制台报警告 （Can’t get DOM width or height. ）

意思是无法获取 DOM 宽度或高度。 请检查 dom.clientWidth 和 dom.clientHeight。 它们不应该为 0。

例如：在网上查看了很多种方法，比如使用内联样式控制宽高，比如position的值由absolute改为relative；但好像都不生效；

解决方案：先初始化后再填数据，放nextTick中

Echarts很多问题都是实例未初始化就进行操作，为了避免这种问题，我们可以 采用nextTick或使用宏任务（定时器）来等Echarts实例化后，再进行下一步操作

2、无法获取Dom

由于echarts图表只有在dom渲染后，才可以进行初始化，所以此处不能在created里面初始化图表，异步请求图表数据，应该要在mounted()里面进行这步操作。

3、切换页面后，图表数据不显示

原因：由于容器上已经有 echarts_instance ，还是上次的，所以Echarts是不会重新初始化的
措施一：手动将DOM上的 echarts_instance 属性移除， 再次进行初始化， 然后setOption
措施二：采用dispose方法销毁图表

4、 X轴左右留白

有时候需要在X轴两侧留有空白，那么设置 xAxis 的 boundaryGap 属性为 true 即可。
如果需要控制左右空白，则根据下面配置可以调节；

这篇好文章是转载于：学新通技术网