Question

使用leaf工具在使用绘图工具在自定义地图上绘制其中一个形状后使用leaflet.js。我有一个弹出的表单，上面写着保存或取消。如果用户按下取消，则我希望删除图形。例如，我正在绘制一个矩形。

这是我目前的来源

map.on('draw:created', function(e) {
    var layer = e.layer;
    var type = e.layerType;

    $("#add-drawing").fadeIn(500);

    featureGroup.addLayer(e.layer); // Adds rectangle

    $("a.cancelD").on("click", function() {
        $("#add-drawing").fadeOut(500);

        // THESE ARE THE METHODS I HAVE TRIED TO REMOVE THE RECTANGLE
        map.removeLayer(layer);
        featureGroup.removeLayer(layer);
        map.removeLayer(e);
        featureGroup.removeLayer(e);
    });     
});

这些似乎都不起作用。我可以使用工具箱删除图层，但后来我没有在我希望提交的表单中提交任何信息。

如何在表单上按取消按钮时删除我绘制的对象？

Answer 1

由于您正在添加featureGroup，您认为有效，因此您应该从featureGroup删除。调用featureGroup.removeLayer(e.layer)或featureGroup.removeLayer(layer)（因为layer包含对e.layer的引用）应该有效。

以下是关于Plunker的工作示例：http://plnkr.co/edit/kPvYbH?p=preview

在我看来，唯一的结论可能是您的活动没有解决，或者您遇到某种奇怪的范围问题但可以轻松调试：

$("a.cancelD").on("click", function() {
    console.log('Click fired!'); // Seeing this in your console, event works
    console.log(featureGroup); // Should return featureGroup instance, scope ok
    console.log(e.layer); // Should return polygon instance, scope ok

    // If all of the above works, this should too
    featureGroup.removeLayer(e.layer);
});

Answer 2

我有同样的问题。对于我的解决方案，

featureGroup.clearLayers（e.layer）;

希望这会有所帮助

Answer 3

或者，您可以在您创建的用于保存所有绘图的 .clearLayers() 图层上简单地调用 featureGroup。

如何删除leaflet.draw中的绘图层？

3 个答案: