如何使用onEachFeature和geojson将标记添加到传单中的不同图层 [英] How to add markers to different layers in leaflet using onEachFeature and geojson

问题描述

我当前的代码仅根据此json文件中的数据绑定标记

My current code merely binds markers according to the data from this json file

{"type": "FeatureCollection", 
    "features": [{
"geometry": {"type": "Point", "coordinates": [53.8460456,-38.9135742]},
"type": "Feature",
"properties":{"name": "red"}]}

我的代码看起来像这样:

and my code looks something like this:

      var blueLayer = new L.LayerGroup();
        var redLayer = new L.LayerGroup();

    var map = L.map('mapid', {
        center: [53.8460456,-38.9135742],
        zoom: 12,
        layers: [blueLayer, redLayer]
    });
    L.tileLayer('https://api.mapbox.com/styles/v1/n-alathba/cj2fzxjgl00bl2rqno6mtb9wg/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1Ijoibi1hbGF0aGJhIiwiYSI6ImNqMmZ6bTQ2cDAwNDIyeW8wY2hidjFxdjUifQ.TyQ2WNEMtCO3Q84PYXlAEA', {
        attribution: 'Tiles by <a href="http://mapc.org">MAPC</a>, Data by <a href="http://mass.gov/mgis">MassGIS</a>',
        maxZoom: 18,
        minZoom: 1,
    }).addTo(map);

 function onEachFeature(feature, layer) {
    return;
   }

 var link = './data/events2.json' //file above
 $.getJSON(link, function(events) { 
     L.geoJSON(events, {    
        style: function(feature) {
            return feature.properties && feature.properties.style;                      
       },    
     onEachFeature: onEachFeature,    
     pointToLayer: function(feature, latlng) {    
     return L.marker(latlng); }
    }).addTo(map);

但是，我想将标记添加到不同的图层，而不是将所有标记直接直接绑定到地图，因此我可以执行以下操作:

However, I would like to add markers to different layers instead of binding them all directly to the map so I can do something like this:

function onEachFeature(feature,layer){
      if(feature.properties.name == "red"){ //do something that binds associated marker to red layer)
       else{//do something that binds associated marker to bluelayer}}

推荐答案

我相信您已经快到了.在onEachFeature函数中，您可以简单地将图层相应地添加到不同的图层组中.然后，您可以随时将图层组添加到地图.试试看:

I believe you are nearly there. In your onEachFeature function, you can simply add layers to your different Layer Groups accordingly. Then, you can add the Layer Groups to the map whenever you want. Try this out:

function onEachFeature(feature,layer) {
    if(feature.properties.name == "red") {
        // add only 'red' markers to Layer Group
        redLayer.addLayer(layer);
    } else {
        // add only 'blue' markers to Layer Group (assuming just red/blue markers)
        blueLayer.addLayer(layer);
    }
}

现在在代码中的其他位置，您可以将以下图层添加到地图中:

Now somewhere else in your code you can add these layers to your map:

redLayer.addTo(mapid);
blueLayer.addTo(mapid);

除非您希望最初在地图上包含所有标记，否则请确保在L.geoJSON()之后删除.addTo()方法.希望这会有所帮助！

Just make sure to remove the .addTo() method after the L.geoJSON() unless you want all the markers on the map initially. Hope this helps!

这篇关于如何使用onEachFeature和geojson将标记添加到传单中的不同图层的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！