vue根據獲取的數據動態循環渲染多個echart（多個dom節點，多個ID）

//在dom節點加載之後調用渲染echart儀表盤方法，this.$nextTick(function(){ }

<div class="chart">

          <div class="geo" v-for="(dataval, index) in dataVal" :key="index" :id="forId(index)"></div>

</div>

methods: {
 forId:function(index){
    return "geo_" +index
 },

  mapTree() {
      this.$nextTick(function(){
        for(var i=0;i<this.dataVal.length;i++){
           //獲取id放入數組中，以便下面渲染echart儀表盤使用
          this.getId.push(this.$echarts.init(document.getElementById('geo_'+i)));
          this.getId[i].setOption({
            title: {
              text: this.dataVal[i].name+'棟',
              textStyle: {
                color: '#00f2f1',
                fontSize: 14
              },
              left: 'center',
              top: 5
            },
            tooltip: {
              formatter: '{a} <br/>{c}'
            },
            series:[
            {
              name: '工作電錶數',
              type: 'gauge',
              radius: '80%',
              min: 0,
              max: Number(this.dataVal[i].sum),
              splitNumber: 10,
              axisLine: {            // 座標軸線
                lineStyle: {       // 屬性lineStyle控制線條樣式
                    color: [[0.30, '#ff4500'], [0.80, '#1e90ff'], [1, 'lime']],
                    width: 1,
                    shadowColor: '#fff', //默認透明
                }
              },
              axisLabel: {            // 座標軸小標記
                color: '#fff',
                shadowColor: '#fff', //默認透明
                shadowBlur: 10
              },
              axisTick: {            // 座標軸小標記
                length: 4,        // 屬性length控制線長
                lineStyle: {       // 屬性lineStyle控制線條樣式
                    color: 'auto',
                    shadowColor: '#fff', //默認透明
                    shadowBlur: 10
                }
              },
              splitLine: {           // 分隔線
                length: 7,         // 屬性length控制線長
                lineStyle: {       // 屬性lineStyle（詳見lineStyle）控制線條樣式
                  width: 2,
                  color: '#fff',
                  shadowColor: '#fff', //默認透明
                  shadowBlur: 10
                }
              },
              pointer: {           // 分隔線
                width:4,//指針的寬度
                length:"70%", //指針長度，按照半圓半徑的百分比
                shadowColor: '#fff', //默認透明
                shadowBlur: 5
              },
              title: {
                textStyle: {       // 其餘屬性默認使用全局文本樣式，詳見TEXTSTYLE
                  fontWeight: 'bolder',
                  fontSize: 10,
                  fontStyle: 'italic',
                  color: '#fff',
                  shadowColor: '#fff', //默認透明
                  shadowBlur: 10
                }
              },
              detail: {
                fontSize: 12,
              },
              data: [{value: this.dataVal[i].normalSum, name: ''}]
            }]
          });
        }
      })
   }
}