Leaflet.draw 无法编辑multipolygon类型多边形 解决方法

问题说明

在做面要素的编辑的时候,当对multiploygon类型的面要素进行编辑的时候,出现如下错误:

TypeError: Cannot read property 'lat' of null

通过查看github issues发现Leaftlet.Draw插件并不支持multipolygon类型的要素

https://github.com/Leaflet/Leaflet.draw/issues/268

解决方法

通过测试发现可以通过将multipolygon拆分成多个polygon要素的方法可以解决这个问题

拆分方法如下:

复制代码
function multiPolygon2polygons (multiPolygon){
    if(multiPolygon.type !== 'MultiPolygon'){
        return
    }
    var polygons = [];
    multiPolygon.coordinates.forEach((item)=>{
        var polygon = {
            type: "Polygon",
            coordinates: []
        };
        polygon.coordinates = item;
        polygons.push(polygon)
    });
    return polygons;
}
复制代码

有时候原始数据可能还是需要保存成multipolygon类型的数据 这时就需要再讲拆分的polygons合并成一个multipolygon

合并方法如下:

复制代码
function polygons2MultiPolygon(geoJson) {
    var newGeoJson = {
        type: "FeatureCollection",
        features: [{geometry: {coordinates: [], type: "MultiPolygon"}, type: "Feature", properties: {}}]
    };
    geoJson.features.forEach((item) => {
        if(item.geometry.type === "Polygon"){
            newGeoJson.features[0].geometry.coordinates.push(item.geometry.coordinates);
        }else{
            item.geometry.coordinates.forEach((item) => {
                newGeoJson.features[0].geometry.coordinates.push(item);
            })
        }
    })
    return newGeoJson;
}
复制代码

 

posted @   羽翼~  阅读(2757)  评论(0)    收藏  举报
编辑推荐:
· 解锁.NET 9性能优化黑科技:从内存管理到Web性能的最全指南
· 通过一个DEMO理解MCP(模型上下文协议)的生命周期
· MySQL下200GB大表备份,利用传输表空间解决停服发版表备份问题
· 记一次 .NET某固高运动卡测试 卡慢分析
· 微服务架构学习与思考:微服务拆分的原则
阅读排行:
· 解锁.NET 9性能优化黑科技:从内存管理到Web性能的最全指南
· .net clr 8年才修复的BUG,你让我损失太多了
· .NET周刊【3月第5期 2025-03-30】
· 一个神奇的JS代码,让浏览器在新的空白标签页运行我们 HTML 代码(createObjectURL
· 即时通信SSE和WebSocket对比
点击右上角即可分享
微信分享提示