echarts中提示“There is a chart instance already initialized on the dom.”的解决办法以及getInstanceByDom的使用

朴灿烈づ我的快乐病毒、 2021-12-09 04:09 574阅读 0赞

当我们想相对ECharts的图标配置进行封装，就会实现相同图标的多样性。  
上一段实例代码

cubeBarChartsXAxisRotateTimeLine: function (data,  id, index) {  
        let linearBarDom = echarts.init(document.getElementById(id)); // 直接进行初始化
        let { dataX, dataArray, axisName} = data;
        let itemData = dataArray[index]
        let options = { 
    
     };
        linearBarDom.setOption(options, true);
    }

如上文代码已经将代码封装，但是每次传值，例如id一直相同，但是传的index一直在变化。  
这时ECharts的就会提示一个“**There is a chart instance already initialized on the dom.**”的提示。

**解决办法**

cubeBarChartsXAxisRotateTimeLine: function (data,  id, index) {  
        let linearBarDom = echarts.getInstanceByDom(document.getElementById(id)); //有的话就获取已有echarts实例的DOM节点。
         if (linearBarDom == null) {  // 如果不存在，就进行初始化。
             linearBarDom = echarts.init(document.getElementById(id));
         }
        let { dataX, dataArray, axisName} = data;
        let itemData = dataArray[index]
        let options = { };
        linearBarDom.setOption(options, true);
    }