the event draw:deletestop to get the specific layer delete - Javascript Leaflet

Javascript examples for Leaflet:Event

  1. HOME
  2. Javascript
  3. Leaflet
  4. Event

Description

the event draw:deletestop to get the specific layer delete

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <link rel="stylesheet" type="text/css" href="https://unpkg.com/leaflet@1.3.3/dist/leaflet.css"> 
      <script type="text/javascript" src="https://unpkg.com/leaflet@1.3.3/dist/leaflet.js"></script> 
      <style id="compiled-css" type="text/css">

#map { height: 580px; }
.leaflet-popup-close-button {
   display: none;
}


      </style> 
      <script type="text/javascript">
    window.onload=function(){//  w w w  . j  ava  2 s  .c  o m
var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
            osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
            osm = L.tileLayer(osmUrl, { maxZoom: 18, attribution: osmAttrib }),
            map = new L.Map('map', { center: new L.LatLng(51.505, -0.04), zoom: 13 }),
            drawnItems = L.featureGroup().addTo(map);
    L.control.layers({
        'osm': osm.addTo(map),
        "google": L.tileLayer('http://www.google.cn/maps/vt?lyrs=s@189&gl=cn&x={x}&y={y}&z={z}', {
            attribution: 'google'
        })
    }, { 'drawlayer': drawnItems }, { position: 'topleft', collapsed: false }).addTo(map);
    map.addControl(new L.Control.Draw({
        edit: {
            featureGroup: drawnItems,
            poly: {
                allowIntersection: false
            }
        },
        draw: {
            polygon: {
                allowIntersection: false,
                showArea: true
            }
        }
    }));
    map.on(L.Draw.Event.CREATED, function (event) {
        var layer = event.layer;
        drawnItems.addLayer(layer);
    });
    map.on('draw:deleted    ', function (e) {
        var deletedLayers = e.layers._layers;
        for (var layer in deletedLayers) {
           console.log(deletedLayers[layer]);
        }
     });
    }

      </script> 
   </head> 
   <body> 
      <script src="https://unpkg.com/leaflet-draw@0.4.0/dist/leaflet.draw.js"></script> 
      <script src="https://leaflet.github.io/Leaflet.draw/src/Leaflet.Draw.Event.js"></script> 
      <link rel="stylesheet" href="https://unpkg.com/leaflet-draw@0.4.0/dist/leaflet.draw.css"> 
      <div id="map"></div>  
   </body>
</html>

Related Tutorials