Question

我有一个包含超过2000多个功能的GeoJSON对象，每个功能都是一个类别的一部分（即“电气”，“军事”等）。总共有 38 类别。

这是我的集合的架构示例：

var allPoints = L.geoJson(myCollection, {
    onEachFeature: function(feature, layer){
        layer.bindPopup(L.Util.template(popTemplate, feature.properties));
    },
    "stylel": function(feature){
        return { "color": legend[feature.properties.category]
    }
}}).addTo(map);

这是我的L.geoJson函数，它遍历了系列：

category

如何将每个L.control.layers({ 'Street Map': L.mapbox.tileLayer('mapbox.streets').addTo(map) },{ 'Electrical': myCollection[feature.properties.category["Electrical"]], 'Military': myCollection[feature.properties.category["Military"]] });属性分配给我的L.control功能，以便用户可以在集合中打开/关闭各种类别？如果我做了每个类别，我可以这样做将数据集和单个geoJSOn图层分类，但要完成所有38个类别的工作太多了。

我的尝试：

{{1}}

有更好的方法吗？谢谢！

Answer 1

您只需在onEachFeature功能中分配图层即可。您甚至可以自动为每个类别创建图层组。

结果：

var categories = {},
    category;

function onEachFeature(feature, layer) {
    layer.bindPopup(L.Util.template(popTemplate, feature.properties));
    category = feature.properties.category;
    // Initialize the category array if not already set.
    if (typeof categories[category] === "undefined") {
        categories[category] = [];
    }
    categories[category].push(layer);
}

// Use function onEachFeature in your L.geoJson initialization.

var overlays = {},
    categoryName,
    categoryArray;

for (categoryName in categories) {
    categoryArray = categories[categoryName];
    overlays[categoryName] = L.layerGroup(categoryArray);
}

L.control.layers(basemaps, overlays).addTo(map);

编辑：将overlays替换为映射而不是数组。

Answer 2

迭代您的GeoJSON集合并创建多个L.GeoJSON图层，每个类别一个，并将它们作为叠加层添加到L.Control.Layers实例。

var controlLayers = L.control.layers({
    'Street Map': L.mapbox.tileLayer('mapbox.streets').addTo(map)
}).addTo(map);

// Object to store category layers
var overlays = {};

// Iterate the collection
collection.features.forEach(function (feature) {

    var category = feature.properties.category;

    // Check if there's already an overlay for this category
    if (!overlays[category]) {

        // Create and store new layer in overlays object
        overlays[category] = new L.GeoJSON(null, {
            'onEachFeature': function () {},
            'style': function () {}
        });

        // Add layer/title to control
        controlLayers.addOverlay(overlays[category], category); 
    }

    // Add feature to corresponding layer
    overlays[category].addData(feature);
});

以下是关于Plunker的示例：http://plnkr.co/edit/Zv2xwv?p=preview

Leaflet：如何从单个集合中切换GeoJSON要素属性？

2 个答案: