单张CSV单张Omnivore组标记

Question

我无法弄清楚使用单张分组外部数据。 我有一个CSV与我的标记，并把杂食性的标记在我的地图上。

如何分组标记？

例如：我有4个标记，它们有一个在csv中指定的“类型”。假设这种类型被称为“freibad”。 如何将所有类型为“freibad”的标记组合到一个名为“freibad”的图层组中，以便能够使用图层控件对它们进行过滤？

//MARKERCLUSTER 
    //VARS II 
    var freibad=[]; 
    function eachLayer(marker) { 
     var ltg = marker.toGeoJSON(); 
     if(ltg.properties.type != ""){ 
       marker.setIcon(L.icon({iconUrl:'/icons/'+ltg.properties.type+'.png'})); 
     } 
     if(ltg.properties.img != ""){ 
      marker.bindPopup('<strong>' + ltg.properties.name + '</strong>' + '<br>' + 
      ltg.properties.description + '<br> <img src="/icons/' + ltg.properties.img +'">') 
     } else { 
      marker.bindPopup('<strong>' + ltg.properties.name + '</strong>' + '<br>' + 
      ltg.properties.description) 
     } 
    } 

    var points = omnivore.csv('/csv/POI.csv', {delimiter:'|'}) 
    .on('ready', function() { 
     var markers = L.markerClusterGroup({ 
      showCoverageOnHover: false, 
      maxClusterRadius: 50 
     }); 
     markers.addLayer(points); 
     map.addLayer(markers); 
     points.eachLayer(eachLayer); 
    }); 

//LAYERGROUPS 
    var ebenengruppen = { 
     "<strong>Wanderrouten</strong>": { 
      "Wanderroute 1": wroute1, 
      "Wanderroute 2": wroute2, 
      "Wanderroute 3": wroute3, 
      "Freibad": freibad 
     } 
    }; 

//TILEMAPS 
    var basemaps = { 
     "Standard": standardTiles 
    } 
    var layerControlMobile = L.control.groupedLayers(basemaps, ebenengruppen, {collapsed:true}), 
     layerControl  = L.control.groupedLayers(basemaps, ebenengruppen); 
    if(mobileDevices){ 
     map.addControl(layerControlMobile); 
    }else{ 
     map.addControl(layerControl); 
    } 

Answer 1

我只是想出了如何解决我的问题。

以下是我所做的： 我为每个需要的条目创建了图层组，并在CSV文件中创建了一个与图层组名称相同的行。通过if语句检查，图层被添加到它们所属的组中。 然而，这不是我想最好的解决方案，不仅是值得的，如果只有几组...

//MARKERCLUSTER 
//LAYERGROUPS 
     var freibad=new L.LayerGroup(); 
     var badestelle=new L.LayerGroup(); 
     var kanueinstieg=new L.LayerGroup(); 
     var kanuvermietung=new L.LayerGroup(); 
     var kanuvermietung=new L.LayerGroup(); 
     var reparatur=new L.LayerGroup(); 
     var radverleih=new L.LayerGroup(); 
//MARKERS 
     function eachLayer(marker) { 
      var ltg = marker.toGeoJSON(); 
      //LAYERGROUPING 
      if(ltg.properties.type == "freibad"){ 
      freibad.addLayer(marker); 
      } 
      if(ltg.properties.type == "badestelle"){ 
      badestelle.addLayer(marker); 
      } 
      if(ltg.properties.type == "kanueinstieg"){ 
      kanueinstieg.addLayer(marker); 
      } 
      if(ltg.properties.type == "kanuvermietung"){ 
      kanuvermietung.addLayer(marker); 
      } 
      if(ltg.properties.type == "reparatur"){ 
      reparatur.addLayer(marker); 
      } 
      if(ltg.properties.type == "radverleih"){ 
      radverleih.addLayer(marker); 
      } 
      // END LAYERGROUPING 
      if(ltg.properties.type != ""){ 
        marker.setIcon(L.icon({iconUrl:'/icons/'+ltg.properties.type+'.svg'})); 
      } 
      if(ltg.properties.img != ""){ 
       marker.bindPopup('<strong>' + ltg.properties.name + '</strong>' + '<br>' + 
       ltg.properties.description + '<br> <img src="/icons/' + ltg.properties.img +'">') 
      } else { 
       marker.bindPopup('<strong>' + ltg.properties.name + '</strong>' + '<br>' + 
       ltg.properties.description) 
       } 
     }