È possibile oscurare una mappa di Google Maps ad eccezione di alcune aree?


15

Quello che sto cercando è un modo per enfatizzare una determinata area su una mappa di Google Maps ingrigendo il resto del mondo.

Ho sentito di una soluzione sull'uso di 2 poligoni di cui 1 è visibile e l'altro no e che funziona solo se la mappa è statica (nessun movimento della mappa). Tuttavia, voglio che l'utente sia in grado di ingrandire e trascinare la mappa.

Sono anche interessato ad altri modi in cui non ho pensato di enfatizzare un'area.

aggiornare:

Quando provo la soluzione pubblicata da radek (ovvero creando un KML con un poligono con un oggetto esterno (più grande della vista) e un oggetto interno (essendo un'area da sottolineare)) ho il problema che quando ingrandisco, le aree rettangolari non sono coperte da il poligono circostante più. Vedere:

inserisci qui la descrizione dell'immagine

Qualcuno con esperienza / soluzione a questo?

Update2:

Finalmente ho avuto il tempo di testare la soluzione di radek utilizzando Google Fusion Tables. All'inizio ho avuto gli stessi problemi con le tessere mancanti come con KML (vedi foto sopra), ma dopo un altro carico sembra che fosse stato raccolto e mostrasse le tessere totalmente corrette. Ho la sensazione che l'hack jquery nella sua soluzione fosse pensato per le tessere che non venivano caricate:

setTimeout(function(){ 
        $("img[src*='googleapis']").each(function() { 
            $(this).attr("src",$(this).attr("src")+"&"+(new Date()).getTime()); 
        }); 
    }, 5000);

Dato che le tessere sembravano caricarsi dopo un aggiornamento, non ho usato l'hack da solo. Se il bug si verifica per ogni nuovo utente, lo sperimenterò.

Risposte:


18

Il blog di Google Maps Mania indica un esempio di mappa dei confini amministrativi svizzeri :

inserisci qui la descrizione dell'immagine

Il codice di Vasile è su github .


1
Questo effettivamente mostra la funzionalità che sto cercando! Dovrò tuffarmi nella fonte per vedere se è facilmente implementabile nel mio caso. Stanno parlando di hack (ho immediatamente paura di IE7).
sig.

L'uso di Google Fusion Tables è un must in questo esempio? Non lo sto usando al momento. Scaricare il codice github e controllare quali sono i requisiti.
sig.

2
Si tratta di creare un poligono in KML con un oggetto esterno, essendo il mondo e un elemento interno, essendo l'area di interesse. Oltre ad avere difficoltà nello styling della trasparenza, continuo ad avere buchi nel mio livello semitrasparente quando ingrandisco.
sig.

1
I KML hanno un caricamento piuttosto lento, quindi cambiarlo continuamente potrebbe dare un effetto molto pigro. A parte questo, non dovrei cambiare costantemente il nome per assicurarmi che il vecchio kml non venga memorizzato nella cache? Ho la sensazione di aver bisogno della conoscenza di Google Fusion Tables.
sig.

1
Esiste un'implementazione più semplice, che può utilizzare un file KML anziché FusionTables? Ho solo bisogno di evidenziare a colori 1 area continua (confini della città) e rendere tutto il resto grigio. Ho esaminato il codice di Vasile, ma è davvero complicato e sembra dipendere dagli hack del browser. Inoltre, se questa soluzione può utilizzare il suggerimento di elrobis di rendere la finestra della mappa la base dell'effetto grigio, penso che sarà molto più stabile / veloce. {disegna un confine intorno alla città e coloralo} // done {annulla tutto TRANNE l'area all'interno del confine} ???????????????
user1845528

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.