Question

美好的一天，我有两个功能 getGeofences（）和getTraces（）

getGeofences（）将向地图添加多边形，getTraces（）将向地图添加标记和折线。

都包含

FGgpx.clearLayers();

它可以很好地清除图层（以及多边形和标记）

我想知道是否有办法只清除多边形或带折线的标记。

例如，当我调用getGeaofences（）时，它仅清除仅包含多边形的图层。当我调用getTraces（）时，它只清除标记和折线。

我查看了每个层的功能，但没有成功！

顺便说一下，我怎样才能获得图层的id，我刚刚创建了！我看看getLayerid和getLayers（）但我显然无法正确使用它。帮助也会很有帮助！

以下是一些代码，向您展示我如何构建我的地图。（我希望我能提供你需要的所有帮助）

var openstreet = osm = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',maxZoom: 18});
//var map = L.map('mapId',{drawControl: true})
var map = L.map('mapId')
  .addLayer(openstreet)
  .setView([51.505, -0.09], 8); // London
var FGgpx = new L.FeatureGroup();
map.addLayer(FGgpx);

创建多边形

var options = {
        position: 'topleft',
        draw: {
            polyline: {
                shapeOptions: {
                    color: '#e0222c',
                    weight: 5
                }
            },
            polygon: {
                allowIntersection: false, // Restricts shapes to simple polygons 
                drawError: {
                    color: '#61dd28', // Color the shape will turn when intersects 
                    message: '<strong>Oh snap!<strong> you can\'t draw that!' // Message that will show when intersect 
                },
                shapeOptions: {
                    color: '#c74ed8',
                    weight: 2//,
                }
            },
            rectangle: false, // Turns off this drawing tool 
            marker: false,
            circle: false
            /*
            circle: {
                drawError: {
                    color: '#61dd28', // Color the shape will turn when intersects 
                    message: '<strong>Oh snap!<strong> you can\'t draw that!' // Message that will show when intersect 
                },
                shapeOptions: {
                    color: '#4aaad1',
                    weight: 2//,
                    //clickable: true
                }
            }
            */
        },
        //edit: false
        edit : {
            featureGroup: FGgpx, //REQUIRED!! 
            remove: false,
        }

    };


var drawControl = new L.Control.Draw(options);

// https://www.npmjs.com/package/leaflet-draw
map.addControl(drawControl);


map.on(L.Draw.Event.CREATED, function (e) {
  var type = e.layerType,
    layer = e.layer;


  var shape = layer.toGeoJSON()
  var shape_for_db = JSON.stringify(shape);

    // Save into mySQL
  saveGeofences(1,shape_for_db);


});

getGeofences（）

function getGeofences(devise_id, clearLayer, fitBounds){


  $.ajax({
    type: "POST",
    url: "maps/sql/getGeofences.php",
    //data: {data:data},
    data: {devise_id:devise_id},
    success: result,
    error: error,
    dataType: "json"
  });

  function error(data)
  {
    console.log("Error getGeofences");
    console.log(data);

  }

  function result(data){

    if(clearLayer == true){
      FGgpx.clearLayers();
    }

    console.log("getGeofenses");


    for (var i = data.features.length - 1; i >= 0; i--) {

      var getgeo_geojson = L.geoJson(data.features[i],{onEachFeature: onEachFeature});

    }

    if(fitBounds == true){
      // fit all geofences
    }

  }
}

getTraces（）

function getTrace(hours){


  $.ajax({
    type: "POST",
    url: "maps/sql/getTraces.php",
    data:{h:hours}, // Send parameter to get.php
    success: result,
    error: error,
    dataType: "json"
  });

  function error(data)
  {
    alert("Error");
    console.log("Error");
    console.log(data);
  }

  function result(data){
    console.log("getTrace");
    nb_trace = 0; // stok le nombre de traces

    /*
    * Clear maker but does not clear the polyline
    */


    FGgpx.clearLayers(); // this clear Polygons and I do not want


    // Pass data to geoJson and do somethin on each position
    //var mon_geojson = L.geoJson(data,{onEachFeature: onEachFeature});
    var mon_geojson = L.geoJson(data,{onEachFeature: onEachFeature});
    mon_geojson.addTo(map); // merge to L.featureGroup()

    /*
    *   Add Plyline
    */

    // cakk connectTheDots to connext each point a polyline
    pathCoords = connectTheDots(mon_geojson);
    var polyline = new L.polyline(pathCoords, configPath );
    polyline.addTo(map);

    getGeofences(1,false,false);


     // Fit the map to all marker
    //map.fitBounds(FGgpx.getBounds());

    console.log("ivalidateSize");
    map.invalidateSize();

    if(nb_trace == 0)
    {
      showPopup("No trace for this period",1800);
    }

  }

};

Answer 1

您应该创建2个不同的功能组。

var geofences = new L.FeatureGroup();
var traces = new L.FeatureGroup();
map.addLayer(geofences);
map.addLayer(traces);

geofences.clearLayers();
traces.clearLayers();

如何识别包含多边形的图层

1 个答案: