如何检测"删除"或"编辑"使用Leaflet-draw-toolbar插件创建的弹出菜单中的事件?

时间:2017-10-21 08:45:06

标签: javascript leaflet gis toolbar leaflet.draw

this example中,您可以创建一个多边形,然后单击它并弹出菜单显示。有三个按钮:编辑,删除和选择颜色。如何检测事件并确定在弹出菜单中执行了哪一项 - 删除或编辑?我想在执行其中一个事件时执行某些操作,例如编辑或删除多边形时。它的标准方式:

map.on('draw:created', function (evt) {
        layer = evt.layer;
        // do something when polygon is created
});

map.on('draw:edited', function (evt) {
        layer = evt.layer;
        // do something when polygon is edited
});

map.on('draw:deleted', function (evt) {
        layer = evt.layer;
        // do something when polygon is deleted
});

但对于弹出菜单中的事件,它不起作用。

所以我编辑了文件leaflet.draw-toolbar.js并添加了我的自定义事件'draw-popup:edited'

LeafletToolbar.EditAction.Popup.Edit = LeafletToolbar.ToolbarAction.extend({
...
    map.on('click', function () {
        shape.editing.disable();
        shape.fire('draw-popup:edited', shape);
    });
...
});

现在,在我的脚本文件中,我能够检测到'draw-popup:edited'事件

layer.on('draw-popup:edited', function() {
        var geom = this.toGeoJSON();
        console.log(geom);

});

但现在,当我点击地图并返回所有已编辑的形状时,它会被多次触发。 检测事件并返回已编辑的形状的正确方法是什么?

2 个答案:

答案 0 :(得分:0)

您可以尝试以下代码:

$('#map').on('click', '.leaflet-popup-toolbar', () => {console.log('click')})

答案 1 :(得分:0)

这是一个错误。开发人员修复了它。关于Geom_text

的更多细节