Vue + Echarts 地图解决缩放或平移后切换地图不显示问题

问题描述

项目需要用到地图切换省市区，在加上地图缩放平移功能后，发现切换省市地图就不显示

缩放平移后切换地图 

 

 

解决方案：

分析：

        chart.setOption(option, notMerge, lazyUpdate);

        图例的setOption有个notMerge参数，可以选择是否不跟之前设置的 option 进行合并，值为false或true。默认为 false。即表示合并，意为在原油组件上添加新的数据。合并的规则，详见 组件合并模式。如果为 true，表示所有组件都会被删除，然后根据新 option 重新创建所有新组件。

解决代码：

        this.chartInstance.setOption(changeOption, true);

但是这样有个弊端，地图的样式都会清空需重新设置。另外也可以使用实例自带的clear()方法，效果跟上述差不多。

   this.chartInstance.clear();//清空画布重新渲染 但格式都会消失