如何检测使用 Leaflet-draw-toolbar 插件创建的弹出菜单中的 "delete" 或 "edit" 事件?
How to detect "delete" or "edit" events in popup menu created with Leaflet-draw-toolbar plugin?
在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);
});
但现在当我单击地图时它会被触发多次,并且 return 所有形状都已编辑。
检测事件和 return 编辑的形状的正确方法是什么?
您可以试试下面的代码:
$('#map').on('click', '.leaflet-popup-toolbar', () => {console.log('click')})
这是一个错误。开发人员修复了它。有关 github.com
的更多详细信息
在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);
});
但现在当我单击地图时它会被触发多次,并且 return 所有形状都已编辑。 检测事件和 return 编辑的形状的正确方法是什么?
您可以试试下面的代码:
$('#map').on('click', '.leaflet-popup-toolbar', () => {console.log('click')})
这是一个错误。开发人员修复了它。有关 github.com
的更多详细信息