javascript - georreferenciación - google maps marker label content

¿Cómo verificar si la API de Google Maps está cargada?

Question

¿Cómo verificar si Google Maps API (v3) está cargado?

No quiero ejecutar scripts de mapeo si la API no se cargó debido a problemas de conectividad a Internet (la página web se aloja localmente).

Answer 1

Considere usar Google Loader

google.load("maps", "3", {callback: myFn});

Cargará su archivo javascript designado, luego ejecutará la devolución de llamada, especificada en el argumento optionalSettings .

Answer 2

Creo que puedes hacer esto con un if(google && google.maps){ … } , a menos que quieras decir lo que está en esta publicación , que es acerca de Maps API V2, pero alguien lo actualizó para v3 here .

Answer 3

EDITAR: si no tiene miedo de ser "no explícito", puede usar "following"; de lo contrario, si no está seguro de si habrá solo una instancia de la variable de google , entonces use la respuesta de DaveS.

Compruebe si google maps v3 api cargado:

if(google && google.maps){
    console.log(''Google maps loaded'');
}

en esta condición, la variable google usará javascript truth para que, si se trata de una función u objeto o una cadena, se convertirá en verdadero y luego tratará de acceder a los maps dentro de ese objeto.

Y inverso:

if(!google || !google.maps){
    console.log(''Not loaded yet'');
}

Answer 4

Ninguna de las respuestas actuales funciona con un 100% de coherencia para mí (excluyendo Google Loader, que no he probado). No creo que verificar la existencia de google.maps sea ​​suficiente para asegurarnos de que la biblioteca haya terminado de cargarse. Estas son las solicitudes de red que estoy viendo cuando se solicita la API de Maps y la biblioteca de lugares opcionales:

Ese primer script define google.maps , pero el código que probablemente necesite ( google.maps.Map , google.maps.places ) no estará disponible hasta que se hayan cargado algunos de los otros scripts.

Es mucho más seguro definir una devolución de llamada al cargar la API de Maps. La respuesta de @ verti es casi correcta, pero aún confía en comprobar google.maps inseguramente.

En cambio, haz esto:

HTML:

<!-- "async" and "defer" are optional, but help the page load faster. -->
<script async defer
  src="https://maps.googleapis.com/maps/api/js?key=API_KEY&callback=mapsCallback">
</script>

JS:

var isMapsApiLoaded = false;
window.mapsCallback = function () {
  isMapsApiLoaded = true;
  // initialize map, etc.
};

Answer 5

Si está utilizando jQuery , tengo buenas noticias para usted:

if (typeof google === ''object'' && typeof google.maps === ''object'') {
     gmapInit();
} else {
     $.getScript(''https://maps.googleapis.com/maps/api/js?key=''+gApiKey+''&language=en'', function(){
         gmapInit();
     });
 }

es similar a la answer-17702802

Answer 6

Una simple comprobación de if(google && google.maps) no funcionó para mí; Todavía recibo un error cuando intento acceder a la API:

TypeError: google.maps.LatLng no es un constructor

En mi caso, esto se debe probablemente a que mis manejadores de eventos de mouse se activaron antes de que la API de mapas haya terminado de descargarse. En este caso, para verificar de manera confiable si los mapas están cargados, creo un alias "gmaps" y lo inicializo en dom ready (usando JQuery):

var gmaps;
$(function () {
    gmaps = google.maps;
});

luego, en mi caso, los controladores puedo usar simplemente:

if(gmaps) {
    // do stuff with maps
}

Answer 7

en la carga asíncrona, esta funciona para mí (Gracias a DaveS):

   function appendBootstrap() {
    if (typeof google === ''object'' && typeof google.maps === ''object'') {
        handleApiReady();
    } else {
        var script = document.createElement("script");
        script.type = "text/javascript";
        script.src = "http://maps.google.com/maps/api/js?sensor=false&callback=handleApiReady";
        document.body.appendChild(script);
    }
}

function handleApiReady() {
    var myLatlng = new google.maps.LatLng(39.51728, 34.765211);
    var myOptions = {
      zoom: 6,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
}

Answer 8

if (google.maps) {...} le dará un error de referencia si google no está definido (es decir, si la API no se cargó).

En su lugar, use if (typeof google === ''object'' && typeof google.maps === ''object'') {...} para comprobar si se cargó correctamente.

Answer 9

tratar

(google && ''maps'' in google)?true:false

o

if(google && ''maps'' in google){
    //true
}
else{
    //false
}

ya que tuve un problema con lo siguiente en un dispositivo móvil:

if (typeof google === ''object'' && typeof google.maps === ''object'') {...}