問題描述

如何從 leaflet-draw 編輯工具欄?

How can I remove the "clear all" action from the delete button in the leaflet-draw edit toolbar?

我知道您可以刪除整個 刪除 按鈕，但仍需要刪除單個項目.基本上是在尋找一種方法來防止用戶從地圖中刪除每個項目.

I know you can remove the whole delete button but still need to remove individual items. Basically looking for a way to prevent the user from deleting every item from the map.

推薦答案

編輯工具欄測試按鈕處理程序上是否存在 removeAllLayers 成員.因此，禁用清除所有操作的一種簡單但可能很笨拙的方法是在 L.EditToolbar.Delete 模塊上使用 removeAllLayers:

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);

還有一個演示

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: '&copy; <a >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"  integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==" crossorigin=""/>
    <script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js" integrity="sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log==" crossorigin=""></script>
    
<link rel="stylesheet"  />
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/0.4.12/leaflet.draw.js"></script>

<div id='map'></div>

這篇關于傳單繪制刪除按鈕刪除“全部清除"行動的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！