Question

我放置了标记并在它们之间绘制了折线，效果很好。

我还为用户提供了使用以下功能删除标记的功能

function hide(marker) {
    map.closePopup();
    map.removeLayer(marker);
}

现在，当删除标记时，我也想删除折线。我一直在进行大量搜索，但没有遇到我的特定问题：我正在使用像素坐标，并且需要删除两个标记之间的折线。

标记

var marker1 = L.marker(map.unproject([8706, 7789], map.getMaxZoom()));
var marker2 = L.marker(map.unproject([8302, 5273], map.getMaxZoom()));
var marker3 = L.marker(map.unproject([9303, 7251], map.getMaxZoom()));

折线

polyline = L.polyline([
    map.unproject([8706, 7789], map.getMaxZoom()),
    map.unproject([8302, 5273], map.getMaxZoom()),
    map.unproject([9303, 7251], map.getMaxZoom())
]);

因此，当用户删除marker1时，折线在marker1和marker2之间消失，但仍在marker2和marker3之间，依此类推。线... 如何实现的？

Answer 1

最简单的方法是跟踪哪些折线属于哪两个标记，如果删除了一个标记，则还要删除该标记。

使用图层组可以轻松完成。

Answer 2

您可以将折线添加到标记中。而且，如果标记被删除，您可以读出这些行并将其删除。

marker1 = L.marker([51.498912, -0.122223],{connectedLines: []}).addTo(mymap);
marker2 = L.marker([51.496988, -0.056305],{connectedLines: []}).addTo(mymap);

poly1 = L.polyline([marker1.getLatLng(),marker2.getLatLng()]).addTo(mymap);
marker1.options.connectedLines.push(poly1);
marker2.options.connectedLines.push(poly1);

function removeMarkerLine(e){
  var marker = this;
    if(marker.options && marker.options.connectedLines){
       var lines = marker.options.connectedLines;
       lines.forEach(function(line){
         mymap.removeLayer(line);
       });
    }
  mymap.removeLayer(marker);
};

https://jsfiddle.net/falkedesign/3aukgm7t/

如何使用标记座标删除小叶折线？

标记

折线

2 个答案: