2015-07-25 18 views
5

Sto provando a creare una mappa interattiva utilizzando leaflet e topojson livello. Voglio fare quanto segue:Recupero poligono TOPOJSON rimosso facendo clic su uno nuovo

1- Quando si fa clic su un determinato poligono topojson, è necessario rimuovere.

2- Quando si fa clic sull'altro poligono, questo deve essere rimosso e il poligono precedentemente cliccato deve essere aggiunto nuovamente.

Quindi in pratica è possibile escludere un solo poligono al massimo in ogni momento. Ecco il blocco di codice per la mappa:

function addRegions(map) { 
    var regionLayer = new L.TopoJSON(); 
    $.getJSON('map-developmentregions.topo.json').done(addRegionData); 

    function addRegionData(topoData){ 
     regionLayer.addData(topoData); 
     regionLayer.addTo(map); 
     regionLayer.eachLayer(handleLayer); 
    } 

    function handleLayer(layer) { 
     layer.setStyle({ 
      fillColor : getColor(getNewsCount(layer.feature.properties.REGION)), 
      weight: 2, 
      opacity: 1, 
      color: 'white', 
      fillOpacity: 1 
     }); 

     layer.on({ 
      mouseover : enterLayer, 
      mouseout: leaveLayer, 
      click: clickAction 
     }); 
    } 

    //Here's the code for clickAction... this is where I suppose the code should be placed 

    function clickAction(e) { 
     var layer = e.target; 
     map.removeLayer(layer); 
    } 
} 

Finora, questo codice mi permette di fare clic sul poligono topojson per rimuoverlo, ma non posso pensare a come recuperare poligono precedentemente rimosso, una volta che l'altro poligono è cliccato.

Penso che dovrei confrontare ogni poligono con il numero totale di poligoni e aggiungere il poligono mancante prima di rimuovere il poligono attualmente cliccato, ma non sono in grado di eseguirlo.

Per favore aiuto. Grazie

risposta

0

Nella funzione clickAction(), iterare sopra il livello di dati e aggiungere ogni caratteristica alla mappa. Al termine, rimuovere la funzionalità corrente.

Quindi, la funzione click diventerebbe

function clickAction(e) { 
    regionLayer.eachLayer(function(layer){ 
     map.addLayer(layer) 
    }); 
    var layer = e.target; 
    map.removeLayer(layer); 
} 

Nota: renderlo sicuro per cambiare la vostra regionLayer portata variabile a una variabile globale, in modo da renderlo accessibile all'interno della vostra funzione di clic.

+0

ha funzionato! grazie mille – jimmypage

+0

fratello benvenuto :) – muzaffar

Problemi correlati