2010-09-23 11 views
6

Spero davvero che qualcuno possa consigliare di visualizzare una mappa di google da un div nascosto.Visualizzazione mappa Google da un'area nascosta

Ho una mappa di google che voglio mostrare a un utente se fa clic su un collegamento, ad esempio, Mostra mappa.

Mettere la mappa in un div nascosto non funziona affatto, quindi sono andato a nascondere la mappa -1000px su un valore css assoluto di posizione.

Questo mi ha dato risultati molto migliori ma quando uso il css per riportare la mappa solo in esso ce n'è.

http://screencast.com/t/MTMyOGZmNW

chiunque può dare a me consigliare il modo migliore per avere una mappa nascosta diventano visibili dopo che ho peform uno spettacolo?

Spero che qualcuno possa consigliare.

Grazie

risposta

25

Non c'è bisogno di perdere tempo con la posizione assoluta e tutto il resto. Lasciate che il div essere nascosto fino a quando necessario, quindi mostrare e chiamare google.maps.event.trigger(map, 'resize') (v3) o map.checkResize() (v2)

scenario aggiuntivo citato nei commenti:

Assicurati di chiamare google.maps.event.trigger(map, 'resize') prima di chiamare map.fitBounds() o si ottengono risultati inaspettati .

+0

Hey Grazie. Ho provato map.checkResize() per V2 e im ottenere la mappa degli errori non è definito. E sì, lo so che sto usando la v2. Eventuali suggerimenti ? – Lee

+0

Aghh, ho capito. Sto usando un plugin jQuery. $ .googleMaps.gMap – Lee

+0

Quando chiami google.maps.event.trigger (mappa, 'ridimensiona')? puoi metterlo sull'evento onclick del div che è nascosto (e poi visualizzato) quando fai clic sul link? – Bill

2

Perché non rinviare il rendering della mappa finché non viene visualizzato il div?

codice di massima:

$("button").click(function() { 
    $(mapDiv).show(); 
    new google.maps.Map(mapDiv, opts); 
}); 
+1

E se è ripetutamente nascosto e mostrato? Non stai creando molti oggetti mappa ma non li stai mai distruggendo. – Mawg

Problemi correlati