首页 文章

将Pane TileLayers与LayerGroup Control集成（V1.0）

提问于
浏览 次
1

我试图找到一种方法，将图层组控制与2个图块层可见的方法相结合，使标签位于我生成的多边形上方 .

http://leafletjs.com/examples/layers-control.html - layergroup guide http://leafletjs.com/examples/map-panes.html - 窗格指南

我的目标是将常用的暗色和浅色cartodb贴图作为选项 - 但仍然使用窗格功能 .

我试图有类似下面的东西，但我不相信传单能够以这种方式处理它 .

有没有人找到一种方法来正确地集成它？

var darkTile = L.tileLayer('http://{s}.basemaps.cartocdn.com/dark_nolabels/{z}/{x}/{y}.png', {
        attribution: '©OpenStreetMap, ©CartoDB'
    }).addTo(map);

    var darkLabels = L.tileLayer('http://{s}.basemaps.cartocdn.com/dark_only_labels/{z}/{x}/{y}.png', {
        attribution: '©OpenStreetMap, ©CartoDB',
        pane: 'labels'
    }).addTo(map);

    var lightTile = L.tileLayer('http://{s}.basemaps.cartocdn.com/light_nolabels/{z}/{x}/{y}.png', {
        attribution: '©OpenStreetMap, ©CartoDB'
    });//.addTo(map);

    var lightLabels = L.tileLayer('http://{s}.basemaps.cartocdn.com/light_only_labels/{z}/{x}/{y}.png', {
        attribution: '©OpenStreetMap, ©CartoDB',
        pane: 'labels'
    });//.addTo(map);
    var light = {
        lightTile,
        lightLabels
    };

    var dark = {
        darkTile,
        darkLabels
    };

    var baseMaps = {
        "Light" : light,
        "Dark" : dark
    };

    L.control.layers(baseMaps).addTo(map);
leaflet

1 回答

  • 0
    • 确保明确创建窗格：
    map.createPane("labels");
    • 创建Layer Groups以收集您的图块层（底图和标签）而不是普通的JS对象 . Leaflet不会使用您的普通对象 .
    var light = L.layerGroup([
  lightTile,
  lightLabels
]);

var dark = L.layerGroup([
  darkTile,
  darkLabels
]).addTo(map); // Add the group to map, rather than its individual layers.

    演示：http://jsfiddle.net/3v7hd2vx/45/

    回复于

相关问题