Comment puis-je vérifier si Google Maps est entièrement chargé ?

Question

J'intègre Google Maps à mon site Web. Une fois que Google Maps est chargé, je dois lancer quelques processus JavaScript.

Existe-t-il un moyen de détecter automatiquement le chargement complet de Google Maps, y compris les téléchargements de tuiles et autres ?

A tilesloaded() Il existe une méthode qui est censée accomplir exactement cette tâche mais cela ne fonctionne pas .

Answer 1

Cela m'a gêné pendant un certain temps avec GMaps v3.

J'ai trouvé un moyen de le faire comme ceci :

google.maps.event.addListenerOnce(map, 'idle', function(){
    // do something only the first time the map is loaded
});

L'événement "idle" est déclenché lorsque la carte passe à l'état d'inactivité - tout est chargé (ou n'a pas été chargé). Je l'ai trouvé plus fiable que tilesloaded/bounds_changed et l'utilisation de addListenerOnce le code dans la fermeture est exécuté la première fois que "idle" est déclenché et ensuite l'événement est détaché.

Answer 2

Je crée des applications mobiles html5 et j'ai remarqué que l'élément idle , bounds_changed et tilesloaded Les événements se déclenchent lorsque l'objet carte est créé et rendu (même s'il n'est pas visible).

Pour que ma carte exécute le code lorsqu'elle est affichée pour la première fois, j'ai fait ce qui suit :

google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
    //this part runs when the mapobject is created and rendered
    google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
        //this part runs when the mapobject shown for the first time
    });
});

Answer 3

Si vous utilisez l'API Maps v3, cela a changé.

Dans la version 3, il s'agit essentiellement de mettre en place un listener pour la fonction bounds_changed qui se déclenchera lors du chargement de la carte. Une fois l'événement déclenché, supprimez l'écouteur car vous ne voulez pas être informé à chaque fois que les limites de la fenêtre d'affichage changent.

Cela peut changer à l'avenir car l'API V3 évolue :-)

Answer 4

Si vous utilisez composants web puis ils ont ceci comme exemple :

map.addEventListener('google-map-ready', function(e) {
   alert('Map loaded!');
});

Answer 5

GMap2::tilesloaded() serait l'événement que vous recherchez.

Voir GMap2.tilesloaded pour les références.