如何动态添加图层和更新图层控件：传单

Question

我正在使用 lealflet api，用户可以在其中绘制形状 地图（图片）...

最初为底图添加了层控制（处理1层） 使用图像叠加......

我在点击事件的页面中添加了一个 ID 为“newLyer”的按钮 处理新层的创建.....即用户可以创建新层 并更新层控制（现在处理 2 层）....

我使用了几种方法来创建图层并添加到控件 但是失败了……

向 layerGroup 添加新图层

var layerGroup = new L.LayerGroup(),
                    imageOverlayUrl = 'aa.jpg',
                    // New imageoverlay added to the layergroup
                    imageOverlay = new L.ImageOverlay(imageOverlayUrl, bounds).addTo(layerGroup),
                    // New featuregroup added to the layergroup
                    featureGroup = new L.FeatureGroup().addTo(layerGroup);

LayerControl 我需要添加控件的地方（如果我是正确的）

        var layerControl = new L.control.layers({
            'Main': layerGroup,
            //here i need to add new layer control
            }, null, { collapsed: false }).addTo(map);

OnClick 函数到目前为止是静态代码，这将在点击时执行

        $('#newLayer').click(function addNewLayer() {
            // Second layergroup not added to the map yet
            var layerGroupNew = new L.LayerGroup(),
                imageOverlayUrlNew = 'bb.png',
                // New imageoverlay added to the second layergroup
                imageOverlayNew = new L.imageOverlay(imageOverlayUrlNew, bounds).addTo(layerGroup2),
                // New featuregroup added to the second layergroup
                featureGroupNew = new L.FeatureGroup().addTo(layerGroupNew);
        });

简而言之

最初，我有一层带有它的控件，现在是 onclick 功能 创建将添加到地图的新图层，但我如何添加 将此层放入layerControl....

如果有人知道如何做这种事情，请帮忙,,,, 任何帮助或参考将不胜感激.... 感谢您的宝贵时间

Answer 1

如果您查看L.Control.Layers 的文档：

http://leafletjs.com/reference.html#control-layers

您会看到L.Control.Layers 有一个addBaseLayer 方法：

http://leafletjs.com/reference.html#control-layers-addbaselayer

将具有给定名称的基础层（单选按钮条目）添加到控件。

你可以这样做：

layerControl.addBaseLayer(newBaseLayer, 'My New BaseLayer');

你可以走了。如您所见，如果您查看reference，就可以省去发布这个问题的麻烦。传单有很好的记录。通过两次完整阅读文档，我个人了解到我对 Leaflet 的了解最多。祝你的项目好运，干杯！