Leaflet Draw Plugin: How to hide/show drawing tools by Layer Type dynamically(Leaflet Draw Plugin:如何按图层类型动态隐藏/显示绘图工具)
问题描述
我在我的项目中使用绘图插件,我想知道如何按图层类型隐藏/显示绘图工具?
I'm using draw plugin in my project and I would like to know how can I hide/show drawing tools by layer type?
例如,假设我有 2 层,其中一层是多边形,另一层是线.
For example, let's say I have 2 layers one of them type is Polygon and the other one is Line.
如果用户选择多边形图层,我想隐藏画线工具.
之后,如果用户选择Line layer,我想隐藏多边形绘图工具.我看过 here 但这个例子使工具静态化,我想动态地改变.我该怎么做?
After that, If user select Line layer, I want to hide Polygon drawing tool. I've looked here but this example is making tools static, I want to change dynamically. How can I do that?
我们将不胜感激.
推荐答案
我自己解决了.我在地图初始化时添加了这个绘制控件.
I solved it myself. I'm adding this draw control when map initialized.
drawControl = new L.Control.Draw({
draw : {
position : 'topleft',
polygon : false,
polyline : false,
rectangle : false,
circle : false
},
edit : false
});
map.addControl(drawControl);
之后,我写了一个重置绘图工具的函数.
After that, i wrote a function for resetting drawing tools.
function setDrawingTools(layerType) {
map.removeControl(drawControl);
if (layerType == 'Polygon') {
drawControl = new L.Control.Draw({
draw : {
position : 'topleft',
polygon : {
title : 'Draw a sexy polygon!',
allowIntersection : false,
drawError : {
color : '#b00b00',
timeout : 1000
},
shapeOptions : {
color : '#bada55'
},
showArea : true
},
polyline : false,
rectangle : false,
circle : false,
marker : false
},
edit : false
});
} else if (layerType == 'Line') {
drawControl = new L.Control.Draw({
draw : {
position : 'topleft',
polygon : false,
polyline : {
metric : false
},
rectangle : false,
circle : false,
marker : false
},
edit : false
});
} else if (layerType == 'Point') {
drawControl = new L.Control.Draw({
draw : {
position : 'topleft',
polygon : false,
polyline : false,
rectangle : false,
circle : false
},
edit : false
});
}
map.addControl(drawControl);
}
这篇关于Leaflet Draw Plugin:如何按图层类型动态隐藏/显示绘图工具的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:Leaflet Draw Plugin:如何按图层类型动态隐藏/显示绘图工具


- Flexslider 箭头未正确显示 2022-01-01
- CSS媒体查询(最大高度)不起作用,但为什么? 2022-01-01
- 失败的 Canvas 360 jquery 插件 2022-01-01
- Quasar 2+Apollo:错误:找不到ID为默认的Apollo客户端。如果您在组件设置之外,请使用ProvideApolloClient() 2022-01-01
- 400或500级别的HTTP响应 2022-01-01
- addEventListener 在 IE 11 中不起作用 2022-01-01
- Fetch API 如何获取响应体? 2022-01-01
- 使用RSelum从网站(报纸档案)中抓取多个网页 2022-09-06
- Css:将嵌套元素定位在父元素边界之外一点 2022-09-07
- 如何使用 JSON 格式的 jQuery AJAX 从 .cfm 页面输出查 2022-01-01