Come cambiare il livello base a livello di codice in MapBox / Leaflet


12

Ho più livelli di base e devo cambiarli a livello di programmazione, a seconda delle varie azioni e stati nella mia applicazione. Non riesco a trovare come, per la vita di me.

Risposte:


16

Questo tutorial serve come un buon esempio:

1) Come mostrato nell'esempio, imposta i livelli di base con un nome di variabile a cui è possibile accedere nella funzione in cui si desidera passare a livello di codice.

var grayscale = L.tileLayer(mapboxUrl, {id: 'MapID', attribution: mapboxAttribution}),
    streets   = L.tileLayer(mapboxUrl, {id: 'MapID', attribution: mapboxAttribution});

2) Quindi aggiungere e rimuovere i livelli che si desidera aggiungere o rimuovere. Quanto segue scambia il grayscalelivello per il streetslivello. Ciò presuppone che entrambi grayscalee streetssiano disponibili nell'ambito della funzione in cui si sta effettuando la commutazione.

map.removeLayer(grayscale);
map.addLayer(streets);

3) Se si utilizza il controllo dei livelli L.control.layersmostrato nell'esempio, il controllo tiene traccia di ciò che si trova sulla mappa e cambia le caselle di conseguenza.


Dov'è mapboxUrl& mapboxAttribution?
Mohammad Dayyan il

@MohammadDayyan devi fare riferimento al tutorial che è collegato sopra
Tom

0

Da /programming//a/33762133/4355695

Normalmente aggiungendo semplicemente un layer alla mappa (ad esempio myTileLayer.addTo (map)), se quel layer fa parte dei layer di base o delle sovrapposizioni del controllo Layer, quest'ultimo aggiornerà automaticamente il suo stato (se hai aggiunto un layer di base, i pulsanti di opzione saranno selezionati di conseguenza; per un overlay, la casella corrispondente sarà spuntata).

Ho provato e ha funzionato: non ho bisogno di preoccuparmi di rimuovere l'attuale baselayer (o di capire quale sia attivo per quella materia). Fa semplicemente myTileLayer.addTo(map)il lavoro: se fa già parte dei miei baselayer, la mappa "passa" ad esso. Rimuove automaticamente il layer corrente e passa a myTileLayer.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.