Leaflet.draw 映射:如何在没有工具栏的情况下启动绘图功能?

2022-01-12 00:00:00 gis leaflet javascript leaflet.draw

对于任何使用过传单或传单.draw 插件的人:

For anyone experienced with leaflet or leaflet.draw plugin:

我想在不使用 leaflet.draw 的工具栏的情况下开始绘制多边形.我已经设法通过在线搜索(不在主文档中)找到允许在不使用工具栏(layer.editing.enable();)的情况下进行编辑的属性.如果没有工具栏按钮,我似乎无法找到如何开始绘制多边形.任何帮助将不胜感激!

I want to initiate drawing a polygon without using the toolbar from leaflet.draw. I've managed to find the property that allows editing without using the toolbar (layer.editing.enable();) by searching online (it's not in the main documentation). I can't seem to find how to begin drawing a polygon without the toolbar button. Any help would be much appreciated!

谢谢你:)

推荐答案

这个简单的代码对我有用:

This simple code works for me:

new L.Draw.Polyline(map, drawControl.options.polyline).enable();

只需将其放入自定义按钮的 onclick 处理程序(或任何您想要的位置).

Just put it into the onclick handler of your custom button (or wherever you want).

变量 mapdrawControl 是对您的传单地图和绘图控件的引用.

The variables map and drawControl are references to your leaflet map and draw control.

深入研究源代码 (leaflet.draw-src.js),您可以找到绘制其他元素以及编辑或删除它们的函数.

Diving into the source code (leaflet.draw-src.js) you can find the functions to draw the other elements and to edit or delete them.

new L.Draw.Polygon(map, drawControl.options.polygon).enable()
new L.Draw.Rectangle(map, drawControl.options.rectangle).enable()
new L.Draw.Circle(map, drawControl.options.circle).enable()
new L.Draw.Marker(map, drawControl.options.marker).enable()

new L.EditToolbar.Edit(map, {
                featureGroup: drawControl.options.featureGroup,
                selectedPathOptions: drawControl.options.edit.selectedPathOptions
            })
new L.EditToolbar.Delete(map, {
                featureGroup: drawControl.options.featureGroup
            })

我希望这对你也有用.

L.EditToolbar.EditL.EditToolbar.Delete 类公开了以下有用的方法:

The L.EditToolbar.Edit and L.EditToolbar.Delete classes expose the following useful methods:

  • enable():启动编辑/删除模式
  • disable():返回标准模式
  • save():保存更改(触发 draw:edited/draw:deleted 事件)
  • revertLayers():撤消更改

相关文章