Question

我加载一些lat / lon信息，然后用它来构建折线。然后，我想在每个折线顶点处添加一个标记，该标记将在点击折线时显示。如果点击不同（或相同）的折线，顶点应该会消失。

下面的代码创建了折线和顶点标记。但顶点标记不会消失。

我尝试用同样的方法做了几种方法。我已经尝试将顶点标记存储在一个数组中并将它们直接添加到地图中，然后map.removeLayer对它们进行处理。这也不起作用。如果我使用L.featureGroup而不是layerGroup，它也不起作用。

显然，我已经错过了关于如何移除标记的地方。有人能指出我方法中的错误吗？

// trackMarkersVisible is a global L.layerGroup

// success is a callback from an ajax that fetches trackData, an array f lat/lon pairs
success: function (trackData) {
    // build an array of latLng's
    points = buildTrackPointSet(trackData, marker.deviceID);

    var newTrack = L.polyline(
            points, {
                color: colors[colorIndex],
                weight: 6,
                clickable: true
            }
    );

    $(newTrack).on("click", function () {
        trackMarkersVisible.clearLayers();

        $.each(points, function(idx, val) {
            var tm = new L.Marker(val);
            trackMarkersVisible.addLayer(tm);
        });
        map.addLayer(trackMarkersVisible);
    });
}

Answer 1

如果没有JSFiddle或者Plunker，很难说，因为我不确定您的行为是什么，但使用clearLayers() L.LayerGroup方法会删除该组中的所有图层。如果该组已经有图层，我会检查onclick处理程序：group.getLayers().length === 0如果该组为空，则添加标记，如果该组使用图层使用clearLayers。代码示例：

polyline.on('click', function (e) {
    if (group.getLayers().length === 0) {
        e.target._latlngs.forEach(function (latlng) {
            group.addLayer(L.marker(latlng));
        });
    } else {
        group.clearLayers();
    }
});

这对我有用，请参阅Plunker上的示例：http://plnkr.co/edit/7IPHrO?p=preview

仅供参考：默认情况下，L.Polyline的实例始终可以点击，因此您可以省略clickable: true

宣传单：从地图中删除标记

1 个答案: