Javascript 在Mapbox中编辑使用map.addLayer添加的多边形

我想编辑使用mapbox上的map.addLayer（）添加的多边形

守则：

map.addLayer({
    'id': 'maine'+id,
    'type': 'fill',
    'source': {
        'type': 'geojson',
        'data': {
            'type': 'Feature',
            'geometry': {
                'type': 'Polygon',
                'coordinates': coords
            }
        }
    },
    'layout': {},
    'paint': {
        'fill-color': '#088',
        'fill-opacity': 0.8
    }
});

---

Mapbox GL图形库用于绘制/编辑形状

您已将多边形添加为贴图层。在绘图模式下直接编辑图层似乎是不可能的。这里有一个可能的方法

首先需要隐藏图层

从图层源获取多边形数据

初始化绘图模式，并使用多边形数据向绘图管理器添加新多边形

编辑完成后，使用图形管理器中编辑的多边形数据更新图层源

从图形管理器中删除多边形

显示更新的图层

您需要使用

add

方法来绘制现有形状

draw.add({
            'id': 'polygon-3355',
            'type': 'Feature',
            'properties': {},
            'geometry': {
                'type': 'Polygon',
                'coordinates': [[[-67.13734351262877, 45.137451890638886],
                    [-66.96466, 44.8097],
                    [-68.03252, 44.3252],
                    [-69.06, 43.98],
                    [-70.11617, 43.68405],
                    [-70.64573401557249, 43.090083319667144],
                    [-70.75102474636725, 43.08003225358635],
                    [-70.79761105007827, 43.21973948828747],
                    [-70.98176001655037, 43.36789581966826],
                    [-70.94416541205806, 43.46633942318431],
                    [-71.08482, 45.3052400000002],
                    [-70.6600225491012, 45.46022288673396],
                    [-70.30495378282376, 45.914794623389355],
                    [-70.00014034695016, 46.69317088478567],
                    [-69.23708614772835, 47.44777598732787],
                    [-68.90478084987546, 47.184794623394396],
                    [-68.23430497910454, 47.35462921812177],
                    [-67.79035274928509, 47.066248887716995],
                    [-67.79141211614706, 45.702585354182816],
                    [-67.13734351262877, 45.137451890638886]]]
            }
        });

图书馆链接：

API方法参考：

显示绘制的多边形区域
正文{margin:0；padding:0；}
#映射{位置：绝对；顶部：0；底部：0；宽度：100%；}
.计算箱{
高度：75px；
宽度：150px；
位置：绝对位置；
底部：40px；
左：10px；
背景色：rgba（255、255、255、.9）；
填充：15px；
文本对齐：居中；
}
p{
字体系列：“开放式SAN”；
保证金：0；
字体大小：13px；
}
使用绘制工具绘制多边形

mapboxgl.accessToken='pk.eyJ1IjoiZWRlbnJheWdhcmRuZXIiLCJhIjoiRlZRVlhqOCJ9.tdrwaenbmctxaovqlyuza'；
/*eslint禁用*/
var map=new mapboxgl.map({
容器：'映射'，//容器id
风格：'mapbox://styles/mapbox/streets-v8',
中心：[-70.11617,43.68405]，
缩放：5
});
var draw=new MapboxDraw({
displayControlsDefault:false，
控制：{
多边形：是的，
垃圾：没错
}
});
map.addControl（draw）；
map.on（'draw.create'，updateArea）；
map.on（'draw.delete'，updateArea）；
map.on（'draw.update'，updateArea）；
画。加({
“id”：“polygon-3355”，
“类型”：“特征”，
“属性”：{}，
“几何学”：{
“类型”：“多边形”，
‘坐标’：[[-67.137343512628745.137451890638886]，
[-66.96466, 44.8097],
[-68.03252, 44.3252],
[-69.06, 43.98],
[-70.11617, 43.68405],
[-70.64573401557249, 43.090083319667144],
[-70.75102474636725, 43.08003225358635],
[-70.79761105007827, 43.21973948828747],
[-70.98176001655037, 43.36789581966826],
[-70.94416541205806, 43.46633942318431],
[-71.08482, 45.3052400000002],
[-70.6600225491012, 45.46022288673396],
[-70.30495378282376, 45.914794623389355],
[-70.00014034695016, 46.69317088478567],
[-69.23708614772835, 47.44777598732787],
[-68.90478084987546, 47.184794623394396],
[-68.23430497910454, 47.35462921812177],
[-67.79035274928509, 47.066248887716995],
[-67.79141211614706, 45.702585354182816],
[-67.13734351262877, 45.137451890638886]]]
}
});
函数updateArea（e）{
var data=draw.getAll（）；
var answer=document.getElementById（‘计算面积’）；
如果（data.features.length>0）{
变量面积=草坪面积（数据）；
//将面积限制为2个小数点
var rounded_area=数学圆整（面积*100）/100；
answer.innerHTML=“”+圆形面积+”平方米；
}否则{
answer.innerHTML=''；
如果（e.type！=“draw.delete”）警报（“使用绘制工具绘制多边形！”）；
}
}

@Hussain Ujjainwala是否只更新多边形层或编辑为绘图模式？