echarts bug:Invalid geoJson formatCannot read properties of undefined (reading ‘length‘)

​​​​​​​

• 问题以及原因：最近写地图遇到这么一个bug，由于数据是自己生成的，根据地图我们了解到一些区域并不是连在一起的但是是属于同一个镇/街道，从而有了如下报错

        -- Invalid geoJson formatCannot read properties of undefined (reading ‘length‘)

• 解释：（小编在4.9.0的echarts下做的）由于生成的地图里属于同一个区域是两块不连续的地图块组成的，但是不是连续的，从而数据也不是在同一个数组中，如下图：

•  echarts 中对于此类型没有做处理，如下图源码位置以及源码：

echarts版本：4.9.0

-- 源码位置：echarts/lib/coord/geo/parseFeoJson

-- 源码内容 

• 解决方法（一）： 将该代码内容赋值入echarts源码中，注释原来的方法

function _default(geoJson, nameProperty) {
    decode(geoJson);
    return zrUtil.map(
        zrUtil.filter(geoJson.features, function(featureObj) {
            if (featureObj.geometry.geometries) {
                let geometry = featureObj.geometry.geometries.map(i => {
                    return i.coordinates;
                });
                let { type, properties, ...params } = featureObj;
                return { type, properties, geometry };
            }
            // Output of mapshaper may have geometry null
            return (
                featureObj.geometry &&
                featureObj.properties &&
                featureObj.geometry.coordinates &&
                featureObj.geometry.coordinates.length > 0
            );
        }),
        function(featureObj) {
            var properties = featureObj.properties;
            var geo = featureObj.geometry;
            var coordinates = geo.coordinates;
            var geometries = [];
            if (geo.type === "GeometryCollection") {
                let geometry = {
                    type: "Polygon"
                };
                let coordinatesArr = featureObj.geometry.geometries.map(i => {
                    return i.coordinates;
                });
                geometry.coordinates = coordinatesArr;
                coordinatesArr.forEach(i => {
                    geometries.push({
                        type: "polygon",
                        // According to the GeoJSON specification.
                        // First must be exterior, and the rest are all interior(holes).
                        exterior: i[0],
                        interiors: i.slice(1)
                    });
                });
            }
            if (geo.type === "Polygon") {
                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") {
                zrUtil.each(coordinates, function(item) {
                    if (item[0]) {
                        geometries.push({
                            type: "polygon",
                            exterior: item[0],
                            interiors: item.slice(1)
                        });
                    }
                });
            }
            var region = new Region(
                properties[nameProperty || "name"],
                geometries,
                properties.cp
            );
            region.properties = properties;
            return region;
        }
    );
}

• 缺点：由于echarts是一个公共的开源的工具，如果我们对工具进行了修改，将来别人用这个项目，或者下一任前端要维护这个项目时很容易留下一个坑，要么提前对接好，说这里改了开源组件，你跑代码之前也需要改，但是如果人使用的人多呢，会留下维护不易。
• 解决方法（二）：手动修改获取的数据，将属于一个县、街道的多个区域块数据重新整合（虽然麻烦点，但至少不会留下坑）

 -- 例子：原数据格式

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "geometry": {
        "type": "GeometryCollection",
        "geometries": [
          {
            "type": "Polygon",
            "coordinates": [
              [
                [
                  119.92127816945431,
                  34.326185806177186
                ],
                [
                  119.89337116971991,
                  34.33111868503994
                ],
                ……数据
              ]
            ]
          },
          {
            "type": "Polygon",
            "coordinates": [
              [
                [
                  120.09353416939943,
                  34.28201088958558
                ],
                [
                  120.10072916997201,
                  34.280715921436695
                ],
                ……数据
              ]
            ]
          }
        ]
      },
      "properties": {
        "name": "滨淮农场",
        "fill-opacity": 0,
        "stroke-opacity": 1,
        "stroke": "#ff0000"
      }
    }
  ]
}

修改后数据格式：

{
  "type": "FeatureCollection",
  "features": [
    {
      "type": "Feature",
      "geometry": {
        "type": "GeometryCollection",
        "geometries": [
          {
            "type": "Polygon",
            "coordinates": [
              [
                [
                  119.92127816945431,
                  34.326185806177186
                ],
                [
                  119.89337116971991,
                  34.33111868503994
                ],
                ……数据
              ],
              [
                [
                  120.09353416939943,
                  34.28201088958558
                ],
                [
                  120.10072916997201,
                  34.280715921436695
                ],
                ……数据
              ]
            ]
          }
        ]
      },
      "properties": {
        "name": "滨淮农场",
        "fill-opacity": 0,
        "stroke-opacity": 1,
        "stroke": "#ff0000"
      }
    }
  ]
}