如何在 Mapbox 中显示多个绘制的多边形

纳什

我想做一个交互式地图,用户可以在其中创建一个多边形(区域)并保存它。用户应该能够看到所有创建的区域。所以我需要用服务器给定的坐标渲染multiPolygon,并允许用户添加更多。

这是我的代码:

var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/streets-v11',
    center: coords,
});
var draw = new MapboxDraw({
    displayControlsDefault: false,
    controls: {
        polygon: true,
        trash: true
    }
});

map.addControl(draw);

map.on('load', function () {
    var multiPolygon = turf.multiPolygon([[pol1],[pol2],[pol3]]);
    // How to render multiPolygon??
});

map.on('draw.create', function (e) {
    const coords = e.features[0].geometry.coordinates;

    // Here save the coords as a new polygon
});

但是我无法使此代码起作用!有人能帮助我吗??

纳什

最后,我单独添加了每个多边形:

// I get areas var from server, which is an array of coordinates
map.on('load', function () {
    map.resize();
    if (areas.length) {
        areas.forEach(area => draw.add(turf.polygon(area.polygon, { id_area: area.id_area, name: area.name })));
    }
});

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章