javascript Leaflet Draw Plugin:如何按图层类型动态隐藏/显示绘图工具

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19676090/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 16:26:50  来源:igfitidea点击:

Leaflet Draw Plugin: How to hide/show drawing tools by Layer Type dynamically

javascriptleaflet

提问by Emre Ko?

I'm using draw plugin in my project and I would like to know how can I hide/show drawing tools by layer type?

我在我的项目中使用绘图插件,我想知道如何按图层类型隐藏/显示绘图工具?

For example, let's say I have 2 layers one of them type is Polygon and the other one is Line.

例如,假设我有两层,其中一层是多边形,另一层是线。

If user select Polygon layer, I want to hide Line drawing tool.

如果用户选择多边形图层,我想隐藏画线工具

After that, If user select Line layer, I want to hide Polygon drawing tool. I've looked herebut this example is making tools static, I want to change dynamically. How can I do that?

之后,如果用户选择Line layer,我想隐藏 Polygon 绘图工具。我看过here但这个例子使工具静态,我想动态改变。我怎样才能做到这一点?

Every suggestion will be appreciated.

每一个建议将不胜感激。

回答by Emre Ko?

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);
}

回答by Dan Burzo

It appears you can't do that with the plugin, but you can use CSS to show/hide certain drawing tools when you switch layers.

使用插件似乎无法做到这一点,但是您可以在切换图层时使用 CSS 来显示/隐藏某些绘图工具。

The buttons have classes like leaflet-draw-draw-polyline, leaflet-draw-draw-polygon, etc.

这些按钮具有类,如leaflet-draw-draw-polylineleaflet-draw-draw-polygon

回答by Mr. Concolato

It sounds like you are trying to gain better control of you layers. Difficult to say without any code posted. Have you considered adding and removing your layers upon user selection? Hereis some documentation on manipulating layers. And the syntax would be something like:

听起来您正试图更好地控制图层。没有发布任何代码很难说。您是否考虑过根据用户选择添加和删除图层?是有关操作图层的一些文档。语法类似于:

map.addLayer(layer_in_question);

or

或者

map.removeLayer(layer_in_question);