echart乡镇地图json echart乡镇、街道地图json获取、制作

1、首先需要下载生成KML文件的工具BigemapGIS Designer

BigemapGIS Designer下载地址
进入http://www.bigemap.com/reader/download/页面下载

按图下载并安装

2、安装完BigemapGIS Designer后，打开导出需要地区的kml文件

导出kml文件命名时不要用中文，否则生成json文件时有时会有问题

3、使用geojson.io/生成json文件

4、也是比较重要的一步，如果不能运行报错，需要吧echart.js文件修改一下

在echart.js文件中找到函数parseGeoJSON，用下边的替换掉

function parseGeoJSON(geoJson, nameProperty) {
      geoJson = decode(geoJson);
      return map(filter(geoJson.features, function (featureObj) {
        // Output of mapshaper may have geometry null
        return featureObj.geometry && featureObj.properties && (
                // avoid length error if missing coordinates
                (featureObj.geometry.coordinates && featureObj.geometry.coordinates.length > 0)
                // allow GeometryCollection
                || (featureObj.geometry.geometries && featureObj.geometry.geometries.length > 0)
            )
      }), function (featureObj) {
        var properties = featureObj.properties;
        var geo = featureObj.geometry;
        var geometries = [];

        if (geo.type === 'Polygon') {
          var coordinates = geo.coordinates;
          geometries.push({
            type: 'polygon',
            // According to the GeoJSON specification.
            // First must be exterior, and the rest are all interior(holes).
            exterior: coordinates[0],
            interiors: coordinates.slice(1)
          });
        }

        if (geo.type === 'MultiPolygon') {
          var coordinates = geo.coordinates;
          each(coordinates, function (item) {
            if (item[0]) {
              geometries.push({
                type: 'polygon',
                exterior: item[0],
                interiors: item.slice(1)
              });
            }
          });
        }else if (geo.type === 'GeometryCollection') {
            var geometries2 = geo.geometries;
            each(geometries2, function (geo) { // OR      zrUtil.each(geometries2, function (geo) {
                var coordinates = geo.coordinates;
                if (geo.type === 'Polygon') { // this is a full copy from above
                    geometries.push({
                        type: 'polygon',
                        exterior: coordinates[0],
                        interiors: coordinates.slice(1)
                    });
                } // end full copy
            });
        }

        var region = new GeoJSONRegion(properties[nameProperty || 'name'], geometries, properties.cp);
        region.properties = properties;
        return region;
      });
    }

主要修改部分是下边两个地方

return featureObj.geometry && featureObj.properties && (
                // avoid length error if missing coordinates
                (featureObj.geometry.coordinates && featureObj.geometry.coordinates.length > 0)
                // allow GeometryCollection
                || (featureObj.geometry.geometries && featureObj.geometry.geometries.length > 0)
            )```

else if (geo.type === 'GeometryCollection') {
            var geometries2 = geo.geometries;
            each(geometries2, function (geo) { // OR      zrUtil.each(geometries2, function (geo) {
                var coordinates = geo.coordinates;
                if (geo.type === 'Polygon') { // this is a full copy from above
                    geometries.push({
                        type: 'polygon',
                        exterior: coordinates[0],
                        interiors: coordinates.slice(1)
                    });
                } // end full copy
            });
        }