1

如何将该地图框图例转换为类似手风琴的结构，以便在单击父图层名称时，子图层名称以缩进形式显示在其下方。我在下面发布了当前标准结构的链接https://www.mapbox.com/mapbox.js/example/v1.0.0/wms/但是我希望我的看起来更像这样http://jsfiddle.net /La77L8L9/3/。不同之处在于我的图层信息来自数据库我目前正在通过在我的 javascript 中创建一个元素 a 作为具有图层名称的可点击链接来添加我的图层，当点击该链接时，将显示相应的地图。我在下面放置了一个片段，说明我当前如何在从数据库中检索图层名称后附加图层名称，请不要让菜单 ui 包含基本地图的名称。

function addLayer(map, layer, name, zIndex) {
    var layers = document.getElementById('menu-ui');
    layer.setZIndex(zIndex)
    layer.addTo(map);
    // Create a simple layer switcher that
    // toggles layers on and off.
    var link = document.createElement('a');
    link.href = '#';
    if (zIndex == 1) {
        link.className = 'active';
       // link.class = 'accordion-toggle';
    }
    else {
        map.removeLayer(layer);
        this.className = '';
    }
    link.innerHTML = name;
    if (zIndex != 1) {
        link.onclick = function (e) {
            e.preventDefault();
            e.stopPropagation();
            if (map.hasLayer(layer)) {
                map.removeLayer(layer);
                this.className = '';
            } else {
                layer.setOpacity(1.0);
                map.addLayer(layer);
                this.className = 'active';
            }
        };
    }
    layers.appendChild(link);
}

我假设也许有一种方法可以给每个元素一个 ID 并使用 .clicked 来执行从可见到假的显示，尽管在使用数据库检索图层名称时动态执行这有点棘手。我的数据库具有图层 ID，如果该特定图层是父图层的子图层，则该图层和 parentLayerID 是否存在。

4

0 回答 0