Echart地图geo map轮播

 

// 初始化第一页地图
    initMapPage1(data) {
      let that = this
      echarts.registerMap("GanSu", mapName);
      /*地图*/
      var map = echarts.init(document.getElementById('page01_map'));
      let index = -1;
      timer = setInterval(function () {
        // 取消高亮指定的数据图形
        map.dispatchAction({
          type: "downplay",
          seriesIndex: 0,
          dataIndex: index,
        });
        // 高亮指定的数据图形
        map.dispatchAction({
          type: "highlight",
          seriesIndex: 0,
          dataIndex: index + 1,
        });
        index++;
        if (index > 85) {
          index = 0;
          that.activeRegionPage1 = data[index].name
        } else {
          that.activeRegionPage1 = data[index].name
        }
      }, 500);
      let mapOption = {
        visualMap: {
          show: true,
          min: 87,
          max: 89,
          top: 'bottom',
          realTime: false,
          calculable: true,
          inRange: {color: ['#1A2344', '#69D4D3']}
        },
        series: [
          {
            type: 'map',
            roam: false,
            data: data,
            map: 'GanSu',
            mapType: 'LX',
            label: {
              normal: {
                show: false,
                textStyle: {
                  color: "#fff",
                },
              },
              emphasis: {
                textStyle: {
                  color: "#fff",
                },
              },
            },
            itemStyle: {
              normal: {
                borderColor: "#002fff",
                borderWidth: 1.5,
                areaColor: "#12235c",
              },
              emphasis: {
                areaColor: "#d3da19",
                borderWidth: 0,
                color: "green",
              },
            },
            zoom: 1.1
          }
        ]
      };
      map.setOption(mapOption);
    },