本文介紹了(已關(guān)閉)Leaflet.js：如何僅在我選擇的特定對(duì)象上編輯幾何圖形？的處理方法，對(duì)大家解決問題具有一定的參考價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)吧！
問題描述
我很興奮，和Leaflet.JS在gis地圖上玩得很開心。我是新手。我也非常感謝@Grzegorz T.的兄弟，感謝他們的好意，并幫助我介紹Leaflet.JS。
現(xiàn)在，我計(jì)劃僅在我選擇的特定對(duì)象上編輯幾何圖形。我已經(jīng)在想如何流動(dòng)和結(jié)果，但過程？(哈哈哈..)。我也已經(jīng)知道Leaflet.js上的DrawItems函數(shù)，但我將使用。
在我開始之前讓我先描述一下簡(jiǎn)單的流程…
A.我剛剛使用了jsfiddle1@Grzegorz T.
B.我添加了DrawItems
...
{ 'DrawLayer': drawnItems }, { position: 'topleft', collapsed: false }).addTo(map);
...
//Add Draw Control//
map.addControl(new L.Control.Draw({
edit: {
featureGroup: drawnItems,
poly: {
allowIntersection: false
}
},
draw: {
polygon: {
allowIntersection: false,
showArea: true
}
}
}));
//Draw Objects//
map.on(L.Draw.Event.CREATED, function (event) {
var layer = event.layer;
drawnItems.addLayer(layer);
});
//Get Leaflet Object ID
drawnItems.on('click', function(event) {
console.log("from drawnItems: " + event.layer._leaflet_id);
});
//Get Geometry from Layer & ID
//Edit Only This Objects
//Save This Editing Back to Original Layer & ID
我在這部分看到的問題是：
1.我不知道如何將我選擇的原始幾何圖形從Layer復(fù)制到DrawLayer。
2.僅隱藏原始層上的此幾何圖形(Id)，直到編輯結(jié)束或取消。(可能將不透明度更改為不可見)
3.完成編輯并保存時(shí)，如何保存回原始層并將結(jié)果顯示到地圖。
我希望誰是鐵桿，誰已經(jīng)在Leaflet.JS上找到了簡(jiǎn)單的方法，JS可以幫助我完成這項(xiàng)骯臟的工作…
更新3/3/2022
我找到了如何重新設(shè)置我選擇的對(duì)象(幾何體)的樣式，這是以下內(nèi)容的封面：
2.僅隱藏原始層上的此幾何圖形(Id)，直到編輯結(jié)束或取消。(可能將不透明度更改為不可見)
代碼如下：-
onEachFeature: function (feature, layer) {
//restyle the geom when display
layer.setStyle({
fillColor: "white",
weight: 2,
color: "#eb4034",
fillOpacity: 0.7,
});
layer.on("mouseover", function (e) {
// style
this.setStyle({
fillColor: "#eb4034",
weight: 2,
color: "#eb4034",
fillOpacity: 0.7,
});
});
layer.on("mouseout", function () {
// style
this.setStyle({
fillColor: "#3388ff",
weight: 2,
color: "#3388ff",
fillOpacity: 0.1,
});
});
layer.on("click", function () {
this.setStyle({
fillColor: "transparent",
weight: 0,
color: "transparent",
fillOpacity: 0,
});
});
},
2022年4月3日更新
有人可以幫助我如何使用編輯模式以編程方式將幾何圖形傳遞給圖形項(xiàng)嗎？假設(shè)我有如下所示的幾何圖形：-
……
{&Q；類型：&Q；要素&Q；，"；geometry"；：{"；type"；："；Polygon"；，&Q；坐標(biāo)&Q；：[[16.3716，54.4414]，[16.3946，54.4477]，[16.4315，54.487]，[16.4797，54.5164]，[16.4968，54.5231]，[16.5299，54.5407]，[16.6145，54.5598]，[16.6887，54.5696]，[16.6991，54.5692]，[16.7126，54.5542]，[16.7392，54.5384]，[16.7481，54.5276]，[16.7392，54.5177]，[16.7566，54.4946]，[16.764，54.4861]，[16.7933，54.4874]，[16.8275，54.4648]，[16.8211，54.4563]，……
.
，&Q；屬性：{&Q；ID&Q；：4，"；nazwa"；："；zachodniopomorskie"；}，&Q；ID&Q；：3}
如何以編程方式將此多邊形(幾何圖形)傳遞到dranItems層？
請(qǐng)幫助我，并提前感謝您閱讀此消息。
推薦答案
掙扎了幾天后，我終于找到了完成任務(wù)的解決方案。它不是很漂亮，但至少我填得還可以，我需要的都在那里。
我使用
layer.on("click", function(e) {
從原始層獲取幾何體和id。我通過使用
傳遞給dranItems的原始幾何圖形
geojsonLayer = L.geoJson(oriGeom);
geojsonLayer.getLayers()[0].addTo(drawnItems);
在圖紙層上拉回以進(jìn)行編輯。當(dāng)我將原始幾何體上的樣式調(diào)整為不可見時(shí)。可編輯的幾何體只能在用戶認(rèn)為這是他/她現(xiàn)在正在編輯的原始幾何體的舞臺(tái)上看到。
onEachFeature: function (feature, layer) {
//restyle the geom when display
layer.setStyle({
fillColor: "white",
weight: 2,
color: "#eb4034",
fillOpacity: 0.7,
});
layer.on("mouseover", function (e) {
// style
this.setStyle({
fillColor: "#eb4034",
weight: 2,
color: "#eb4034",
fillOpacity: 0.7,
});
});
layer.on("mouseout", function () {
// style
this.setStyle({
fillColor: "#3388ff",
weight: 2,
color: "#3388ff",
fillOpacity: 0.1,
});
});
layer.on("click", function () {
this.setStyle({
fillColor: "transparent",
weight: 0,
color: "transparent",
fillOpacity: 0,
});
完成編輯后，我使用Python類按搜索ID保存回原始層，并僅將原始坐標(biāo)替換為新坐標(biāo)(EditGeom)。：)
然后我用這個(gè)技巧刪除了dranItems層中的所有對(duì)象
document.querySelector(".leaflet-draw-edit-remove").click(); //fake click Delete
document.querySelector("ul li:last-child a").click(); //fake click Save All
僅此而已。
這篇關(guān)于(已關(guān)閉)Leaflet.js：如何僅在我選擇的特定對(duì)象上編輯幾何圖形？的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，
