2014-12-22 30 views
5

Aggiungo il marker sulla mappa al clic dell'utente.
Il problema è che voglio solo un marcatore ma ora ogni volta che clicco sulla mappa viene aggiunto un nuovo marcatore.
Sto cercando di toglierlo, ma non succede nulla:
Come rimuovere un marker dalla mappa dei volantini

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

risposta

2

Usa .off() non associare l'evento al clic.

Dovrebbe essere qualcosa di simile:

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

Non ho prove, ma dovrebbe almeno mettere nella giusta direzione.

+0

Non c'è assolutamente alcuna ragione per tirare in un'altra libreria dal opuscolo ha il metodi propri per il legame e eventi non vincolanti: [http://leafletjs.com/reference.html#events](http://leafletjs.com/reference.html#events) – iH8

+0

@ iH8 E hai perfettamente ragione! – grim

7

Invece di utilizzare .on per acquisire e gestire l'evento, è possibile utilizzare .once. In questo modo l'evento verrà catturato una volta sola e il conduttore si slegherà da solo.

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

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

Se siete mai bisogno di sciogliere un gestore da soli è possibile utilizzare .off. Controllare il riferimento per i metodi di eventi: http://leafletjs.com/reference.html#events

Quanto al motivo per cui il codice di cui sopra non funziona, il primo clic si sta cercando rimuovere il marcatore: map.removeLayer(marker), ma la variabile non contiene un esempio L.Marker così la mappa non è in grado di rimuoverla. Si dovrebbe verificare se è definito prima e unica poi rimuoverlo:

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

Ecco un esempio di lavoro sul Plunker: http://plnkr.co/edit/iEcivecU7HGajQqDWzVH?p=preview