代码逻辑：

一：引入echarts，以及引入china.js、china.json

二：设置echarts配置项

三：处理点击选中事件

代码：

<template>
  <div class="wrap">
    <div class="screen" ref="screen"></div>
  </div>
</template>

<script>
import echarts from 'echarts'
import 'echarts/map/js/china.js'
import 'echarts/map/json/china.json'
export default {
  name: 'default',
  data() {
    return {
      mapSelParam: null,    //选中的参数
      echart: {
        title: '中华人民共和国',   //选中的省份
        zoom: 0.4
      }
    };
  },
  components: {
  },
  methods: {
    initEcharts(){
      //初始化echarts
      let echartApp = echarts.init(this.$refs.screen);

      //设置配置项
      echartApp.setOption(this.getEchartsOptions())

      //点击各省份事件处理
      let _this = this;
      echartApp.on('click', param => {
        //获取到的省份名
        let temp = JSON.stringify(this.mapSelParam);
        if(this.mapSelParam){
          //取消选中前一次选中的省份
          echartApp.dispatchAction({
            type: 'geoUnSelect',
            seriesIndex: this.mapSelParam.seriesIndex,
            seriesName: this.mapSelParam.seriesName,
            dataIndex: this.mapSelParam.dataIndex,
            name: this.mapSelParam.name
          })
        }

        this.mapSelParam = {
          seriesIndex: param.seriesIndex,
          seriesName: param.seriesName,
          dataIndex: param.dataIndex,
          name: param.name
        }
        
        //*********************************
        //***为选中的省份的参数赋值**********
        //*********************************
        this.$set(this.echart, 'title', param.name);

        echartApp.setOption(this.getEchartsOptions());
        //如果前一次选中与当前选中相同，则return，取消选中
        if(temp === JSON.stringify(this.mapSelParam)){
          this.$set(this.echart, 'title', '中华人民共和国');
          echartApp.setOption(this.getEchartsOptions());
          this.mapSelParam = {};
          return;
        }

        //选中当前点击的省份
        echartApp.dispatchAction({
          type: 'geoSelect',
          seriesIndex: this.mapSelParam.seriesIndex,
          seriesName: this.mapSelParam.seriesName,
          dataIndex: this.mapSelParam.dataIndex,
          name: this.mapSelParam.name
        })
      })

      this.$nextTick(() => {
        this.echart.zoom = 1.1;
        echartApp.setOption(this.getEchartsOptions());
      })
    },
    getEchartsOptions(){
      return {
        title: {
          text: this.echart.title,
          textStyle: {
            color: '#FFF',
            fontSize: 24
          },
          top: 20,
          left: 20
        },
        geo: {
          //引入中国地图
          map: 'china',
          //是否可以缩放，拖拽
          roam: true,
          zoom: this.echart.zoom,
          //地名配置项
          label: {
            //默认情况下配置项
            normal: {
              show: true,
              textStyle: {
                color: '#CCC'
              }
            },
            //选中高亮情况下配置项
            emphasis: {
              textStyle: {
                color: '#FFF'
              }
            }
          },
          //各省样式
          itemStyle: {
            normal: {
              areaColor: '#3034A0',
              borderColor: '#3057D3',
              borderWidth: 1,
            },
            emphasis: {
              areaColor: '#4467CC',
              borderColor: '#448aff',
            }
          },
          scaleLimit: {
            min: 0.7,
            max: 10
          }
        },
        //设置各省份根据值(value)显示不同颜色
        visualMap: {
          //最大最小值
          min: 0,
          max: 1000,
          //最大最小值描述
          text: ['High', 'Low'],
          //文字颜色
          textStyle: {
            color: '#CCC'
          },
          //拖拽时，是否实时更新。
          realtime: false,
          //是否显示拖拽用的手柄
          calculable: true,
          //定义在选中范围中 的视觉元素
          inRange: {
            color: ['lightskyblue', 'yellow', 'orangered']
          }
        },
        //系列配置
        series: [{
          name: '大数据',
          type: 'map',
          //【此参数必须配置，否则visualMap不起作用】
          geoIndex: 0,
          //此处可接收后端参数，当前数据仅为测试
          data: [{
            name: '湖南',
            value: 1000
          }]
        }],
        animationType: 'scale',
        animationEasing: 'elasticOut',
        animationDelay: 2000
      }
    }
  },
  mounted(){
    //代码入口
    this.initEcharts();
  }
};
</script>

<style lang="css" scoped>
.wrap{
  background-color: #22287C;
  min-height: 100%;
}
.screen{
  width: 1000px;
  min-height: 800px;
}
</style>

echarts使用版本："echarts": "^4.2.1"

使用npm安装此插件

cnpm install echarts@4.2.1 -S

最终实现效果：

示例图