【问题标题】:Set Active Layer of Multi-layer Map设置多层地图的活动层
【发布时间】:2020-05-23 03:19:33
【问题描述】:

我有一个 5 层的传单地图,每层都有多个地图点。从 5 个单独页面中的任何一个,用户可以选择查看任何一个地图图层的所有地图点。所需类型通过 URL 传递到 View_All 页面。 View_All 页面包含 Leaflet 地图,其中包含为图层和地图点动态构建的五个图层。

我需要首先在地图完全构建后将用户所需的地图图层设置为活动图层。此外,我需要访问图层控件以确定用户何时选择了另一个图层,以便可以更新页面标题以反映正在查看的信息类型。

Here is a link 到一个准完成的页面。

TIA 寻求任何帮助。 杰达威尔森

【问题讨论】:

    标签: leaflet


    【解决方案1】:

    向您的地图添加图层控件,然后监听baselayerchange 事件。

    var overlayMaps = {
        "Cemeteries": l1, //l1,l2,... Layergroups or GeoJSON Layer
        "Churches": l2,
        "Markers": l3,
        "Schools": l4,
        "Towns": l5,
    };
    
    
    var text = {
        "Cemeteries": "Test Cemeteries",
        "Churches": "Test Churches",
        "Markers": "Test Markers",
        "Schools": "Test Schools",
        "Towns": "Test Towns",
    }
    
    mymap.addLayer(l3); //Acitve Layer from URL
    L.DomUtil.get("textheaderid").innerHTML = text["Markers"];
    
    
    L.control.layers(overlayMaps).addTo(mymap);
    mymap.on('baselayerchange',function(e){
        console.log(e)
      var name = e.name;
      var str = text[e.name];
      console.log(str);
      L.DomUtil.get("textheaderid").innerHTML = str;
    })
    
    

    示例:https://jsfiddle.net/falkedesign/q1kmtf93/

    【讨论】:

    • 感谢代码!除了一件小物品外,一切都按预期工作。页面标题不反映与用户请求对应的标题。请求的图层已激活,但航向不正确。我将 text["Markers"] 行更改为我能想到的所有内容,但它总是以未定义的形式出现。这是最新代码视图的link
    • 当您向我展示您的代码而不是没有新代码的网站时,这将非常有用;) 您的 overlayMaps 名称如 "Cemeteries", "Churches",.. 是否与 text "Cemeteries", "Churches",.. 中的名称相同?否则它找不到正确的文本,因为这是参考
    • 发现问题。简单的修复,感谢您的评论。感谢您的所有帮助。
    猜你喜欢
    • 2017-01-09
    • 1970-01-01
    • 1970-01-01
    • 2020-11-23
    • 1970-01-01
    • 2016-09-09
    • 2018-06-14
    • 1970-01-01
    • 2011-05-29
    相关资源
    最近更新 更多