对比geojson数据发现,出现报错原因是因为数据类型中有GeometryCollection存在。经分析,由于生成的地图里有一个区域为两块不连续的地图块,所以生成的geoJson中此区域的geometry.type===GeometryCollection。然而,echarts 中对于此类型没有做处理,详情见
源码
node_modules\echarts\lib\coord\geo\parseGeoJson.js
访问官方的github仓库,issues存在对应的解决方法, https://github.com/apache/echarts/issues/9350
二、修改方法
如果函数一样,可直接复制粘贴下面这一段,其他情况,请参考下图2处修改逻辑自行更改。
export default function parseGeoJson(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;
console.log(coordinatesArr, "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") {
console.log("coordinatesPolygon", 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") {
zrUtil.each(coordinates, function(item) {
if (item[0]) {
geometries.push({
type: "polygon",
exterior: item[0],
interiors: item.slice(1)
});
}
});
}
console.log(
properties[nameProperty || "name"],
geometries,
properties.cp,
"asdfasdfasdf"
);
var region = new GeoJSONRegion(
properties[nameProperty || "name"],
geometries,
properties.cp
);
region.properties = properties;
return region;
}
);
}
需要修改的parseGeoJson函数中的2处:echarts 源代码在116行左右