写在前面
最近在项目中快要被echarts玩死了,遇到一个神奇的问题,那就是在有一个列表点击切换各种类型的数据,在大数据量切回小数据量的图表时,发现图表绘制错误,于是就开始各种找错误,搞了差不多一个下午,折腾了半天才搞出来,记录下来,最后说一下解决方案:
首先,吐槽一下echarts,里边自带的 setOption设置为true,是不管用的,被坑了好久,亲测,不设置true的时候也会重画,是因为我改变了数据,后来大数据的时候才发现不管用。
//vue 项目写法
let MyEcharts = this.$echarts.init(document.getElementById("performanceBarD") );
this.MyEcharts.clear(); //先clear在重绘,才可以真正重绘
this.MyEcharts.setOption(echartsOptions, true); //设置为true可以是图表切换数据时重新渲染
折腾了半天才发现,要是真正达到重绘需要必须先清掉之前的图表,然后再次重新画图,这样才能达到真正的重绘。
这样互相切换就可以重绘了,不会出现绘制错误了。