echarts地图合并(省和省合并，市和市合并，省和市合并)

echarts地图合并(省和省合并，市和市合并，省和市合并)

  //获取要合并地图的数据
  $scope.getMergeMapData = function () {
      // var areaArr = [{pro:'湖北',city:[]}]
      // var areaArr = [{pro:'广东',city:['潮州市','揭阳市','汕头市','汕尾市']}]
      // var areaArr = [{pro:'中国',city:['黑龙江','吉林']}]
      var areaArr = [{pro:'中国',city:['内蒙古']},{pro:'吉林',city:['白城市','松原市']}]
      // var areaArr = [{pro:'江苏',city:['常州市']}]
      // var areaArr = [{pro:'湖北',city:['十堰市','襄阳市']}]
      $scope.mergeMap(areaArr).then(res=>{
          $scope.areaMap = res;
          $scope.showMap($scope.areaMap);
      });
  }

   //地图合并的方法
   $scope.mergeMap = function (areaArr){
       return new Promise((ok,no)=>{
           let result = [];
           let successNum = 0;
           areaArr.forEach(areaItem=>{
               $.get(`./geo/${areaItem.pro}.json`, geoJson => { //请求本地的地图json文件
                   if(areaArr.length == 1 && areaItem.city.length == 0){
                       geoJson = decode(geoJson)
                       result = geoJson.features;
                   }else{
                       geoJson.features.forEach(featuresItem=>{
                           areaArr.forEach(areaItem2=>{
                               areaItem2.city.some(cityItem=>{
                                   if(featuresItem.properties.name == cityItem){
                                       if(areaItem2.pro !== "中国"){
                                           geoJson = decode(geoJson)
                                       }
                                       result.push(featuresItem);
                                       return true;
                                   }
                               })
                           });
                       });
                   }
                   successNum++;
                   if(successNum == areaArr.length){
                       ok({
                           type:"FeatureCollection",
                           features:result
                       });
                   }
               });
           })
       } )
   }
   $scope.getMergeMapData();

    //解码 
    function decode(json) {
        if (!json.UTF8Encoding) {
            return json;
        }
        var encodeScale = json.UTF8Scale;
        if (encodeScale == null) {
            encodeScale = 1024;
        }

        var features = json.features;

        for (var f = 0; f < features.length; f++) {
            var feature = features[f];
            var geometry = feature.geometry;
            var coordinates = geometry.coordinates;
            var encodeOffsets = geometry.encodeOffsets;

            for (var c = 0; c < coordinates.length; c++) {
                var coordinate = coordinates[c];

                if (geometry.type === 'Polygon') {
                    coordinates[c] = decodePolygon(
                        coordinate,
                        encodeOffsets[c],
                        encodeScale
                    );
                }
                else if (geometry.type === 'MultiPolygon') {
                    for (var c2 = 0; c2 < coordinate.length; c2++) {
                        var polygon = coordinate[c2];
                        coordinate[c2] = decodePolygon(
                            polygon,
                            encodeOffsets[c][c2],
                            encodeScale
                        );
                    }
                }
            }
        }
        // Has been decoded
        json.UTF8Encoding = false;
        return json;
    }
    function decodePolygon(coordinate, encodeOffsets, encodeScale) {
        var result = [];
        var prevX = encodeOffsets[0];
        var prevY = encodeOffsets[1];

        for (var i = 0; i < coordinate.length; i += 2) {
            var x = coordinate.charCodeAt(i) - 64;
            var y = coordinate.charCodeAt(i + 1) - 64;
            // ZigZag decoding
            x = (x >> 1) ^ (-(x & 1));
            y = (y >> 1) ^ (-(y & 1));
            // Delta deocding
            x += prevX;
            y += prevY;

            prevX = x;
            prevY = y;
            // Dequantize
            result.push([x / encodeScale, y / encodeScale]);
        }

        return result;
    }


    //展示地图 
    $scope.showMap = function(geoJson){
        var areaMap = echarts.init(document.getElementById('areaMap'));
        echarts.registerMap('HK', geoJson);
        var areaOption = {
            series: [
                {
                    type: 'map',
                    roam: true,
                    zoom: 1.0,
                    // layoutCenter: ['65%', '30%'],
                    // 如果宽高比大于 1 则宽度为 100，如果小于 1 则高度为 100，保证了不超过 100x100 的区域
                    // layoutSize: '250',
                    mapType: 'HK', // 自定义扩展图表类型
                    itemStyle:{
                        normal:{
                            areaColor:'#f2f2f2',
                            borderWidth:'0.7'//,
                        }
                    },
                    data:[
                        {name:"内蒙古",value:"20"},
                        {name:"白城市",value:"80"},
                        {name:"松原市",value:"60"}
                    ]
                }
            ]
        };
        if (areaOption && typeof areaOption === "object") {
            areaMap.setOption(areaOption, true);
            var width = $("#areaMap").width();
            var height = $("#areaMap").height();
            areaMap.resize(width, height);
            /*窗口自适应，关键代码*/
            $(window).resize(function () {
                areaMap.resize();
            });
        }
    }

<div id="areaMap" class="areaMap" style="width: 500px; height: 500px;"></div>

注： 1，本地的地图json文件要中文的命名（eg：中国.json 广东.json）;
2，为什么要解码？ 因为中国地图json文件里的坐标点是已经解码的，而省份地图的json文件里的点是编 码的；