leaflet-draw delete button remove "clear all" action
The edit toolbar tests the existence of a removeAllLayers
member on the button handler. So, a simple but probably heavy handed way to disable the clear all action is to nuke removeAllLayers
on the L.EditToolbar.Delete
module:
L.EditToolbar.Delete.include({
removeAllLayers: false
});
new L.Control.Draw({
edit: {
featureGroup: drawnItems
},
draw: {
}
}).addTo(map);
And a demo
var map = L.map(document.getElementById('map'), {zoomControl: false}).setView([48.8583736, 2.2922926], 15);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
var drawnItems = new L.geoJson().addTo(map);
map.on(L.Draw.Event.CREATED, function (event) {
var layer = event.layer;
drawnItems.addLayer(layer);
});
L.EditToolbar.Delete.include({
removeAllLayers: false
});
new L.Control.Draw({
edit: {
featureGroup: drawnItems
},
draw: {
polygon: false,
rectangle: false,
circlemarker: false
}
}).addTo(map);
html, body {
height: 100%;
margin: 0;
}
#map {
width: 100%;
height: 100%;
}
<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==" crossorigin=""/>
<script src="https://unpkg.com/[email protected]/dist/leaflet.js" integrity="sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log==" crossorigin=""></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/0.4.12/leaflet.draw.css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/0.4.12/leaflet.draw.js"></script>
<div id='map'></div>
i use this code and work for me. change remove to true==>> remove: true
:
var drawControl = new L.Control.Draw({
position: 'topright',
draw: {
polyline: false,
polygon:false,
circle: false, // Turns off this drawing tool
rectangle: true,
marker: true
},
edit: {
featureGroup: drawnItems,
remove: true
}
});