Jak usunąć znacznik z mapy ulotek

Question

Dodaję znacznik na mapie po kliknięciu przez użytkownika.
Problem polega na tym, że chcę tylko jeden znacznik, ale teraz, gdy kliknę na mapie, dodany zostanie nowy znacznik.
Staram się go usunąć, ale nic się nie dzieje:

var marker; 
    map.on('click', function (e) { 
     map.removeLayer(marker) 

     marker = new L.Marker(e.latlng, { draggable: true }); 
     marker.bindPopup("<strong>" + e.latlng + "</strong>").addTo(map); 

     marker.on('dragend', markerDrag); 
    }); 

Answer 1

Zastosowanie .off() aby rozpiąć się na kliknięcie zdarzenia.

Powinno być coś takiego:

var marker; 
map.on('click', mapClicked); 

function mapClicked(e) { 
    map.off('click', mapClicked); 
    map.removeLayer(marker) 

    marker = new L.Marker(e.latlng, { draggable: true }); 
    marker.bindPopup("<strong>" + e.latlng + "</strong>").addTo(map); 

    marker.on('dragend', markerDrag); 
} 

nie przetestować go, ale powinien przynajmniej można umieścić we właściwym kierunku.

Answer 2

Zamiast używać .on do przechwytywania i obsługi zdarzenia, można użyć .once. W ten sposób wydarzenie zostanie przechwycone tylko jeden raz, a przewodnik odłączy się później.

map.on('click', function() { 
    console.log('I fire every click'); 
}); 

map.once('click', function() { 
    console.log('I fire only once'); 
}); 

Jeśli kiedykolwiek musiał rozpiąć Handler siebie można użyć .off. Sprawdź odniesienie do metod zdarzenia: http://leafletjs.com/reference.html#events

Jako dlaczego Twój kod powyżej nie działa, kliknij na pierwszy próbujesz usunąć znacznik: map.removeLayer(marker), ale zmienna nie zawiera instancję L.Marker tak mapa nie może go usunąć. Należy sprawdzić, czy jest zdefiniowana najpierw, a dopiero potem wyjąć go:

var marker; 
map.on('click', function (e) { 
    if (marker) { // check 
     map.removeLayer(marker); // remove 
    } 
    marker = new L.Marker(e.latlng); // set 
}); 

Oto przykład pracuje nad Plunker: http://plnkr.co/edit/iEcivecU7HGajQqDWzVH?p=preview