affichage Google carte à partir d'une zone cachée

Question

J'espère vraiment que quelqu'un peut vous conseiller sur l'affichage d'une carte Google à partir d'un div caché.

J'ai une carte Google que je veux montrer un utilisateur s'ils cliquent sur un lien par exemple, Afficher le plan.

Mettre la carte dans un div caché ne juste que je fonctionne pas du tout alors je suis allé avec cacher la carte -1000px sur une position de valeur absolue css.

Cela m'a donné des résultats beaucoup mieux, mais quand je l'utilise pour amener la css carte de retour en seulement avoir de celui-ci montre.

http://screencast.com/t/MTMyOGZmNW

Quelqu'un peut-il me donner des conseils sur la meilleure façon d'avoir une carte cachée devenir visible après que je peform un spectacle?

quelqu'un L'espoir peut conseiller.

Merci

Answer 1

Vous devez vous embêtez pas avec la position absolue et tout cela. Laissez le div caché jusqu'à ce que nécessaire, montrer alors et appelez google.maps.event.trigger(map, 'resize') (v3) ou map.checkResize() (v2)

scénario supplémentaire mentionné dans les commentaires:

Assurez-vous que vous appelez google.maps.event.trigger(map, 'resize') avant d'appeler map.fitBounds() ou vous obtiendrez des résultats inattendus .

Answer 2

Avez-vous essayé d'appeler l'événement resize de la carte?

Google Maps API - Map

Answer 3

Pourquoi ne pas différer le rendu de la carte jusqu'à ce que le div est affiché?

Code rugueux:

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