Pregunta

Estoy utilizando la API de Google Maps v3 en un sitio web que estoy desarrollando. Tengo un cuadro desplegable debajo de mi mapa que permite al usuario cambiar entre diferentes conjuntos de marcadores que se mostrará en el mapa. Cada marcador se visualiza mediante marker.setMap().

Mi problema es que el mapa a veces tarda mucho tiempo para mostrar los nuevos marcadores, especialmente en el IE. Quiero mostrar una animación de "Carga", mientras que el mapa está cambiando marcadores. Pero no sé cómo detectar cuando el mapa se ha terminado de mostrar los nuevos datos (no hay carga de la página, ya que todo esto es AJAX). ¿Hay una devolución de llamada o de detector de eventos para un evento setMap(), para que pueda llamar a una función para detener la animación "Carga" cuando el último marcador tiene terminado de cargar?

¿Fue útil?

Solución

No parece que haya un oyente de devolución de llamada o evento para setMap (), pero me di cuenta de una manera de lograr lo que quería. Estoy cargando el mapa de Google usando jQuery. Aquí está mi código.

Al inicializar el mapa, He creado un detector para el evento 'inactivo', que oculta la animación de "carga". El evento 'inactivo' se activa cada vez que el mapa es nuevo trazado terminada después de un desplazamiento o zoom cambio:

google.maps.event.addListener(this.map, 'idle', function() {
 $('#loading').hide();
});

Y en mi función de superposiciones transparentes, lo primero que muestro la animación de carga, a continuación, desactive cada marcador usando setMap (nulo). Entonces recenter muy poco el mapa cambiando la longitud de 0,000000001. Esto sucede después de todo el setMap () llamadas, y activa el evento 'inactivo' que oculta la animación de carga.

// clear overlays from the map
function clearOverlays() {
 $('#loading').show();

 // clear the markers from the active data array
 if (activeData) {
  for (i in activeData) { activeData[i].setMap(null); }
 }
 activeData = '';

 // very slightly recenter the map to trigger the 'idle' event
 var centerlat = MYMAP.map.getCenter().lat();
 var centerlng = MYMAP.map.getCenter().lng() + .000000001;
 recenter = new google.maps.LatLng(centerlat, centerlng);
 MYMAP.map.setCenter(recenter);
}

Es un poco de un truco, pero espero que alguien encuentre otro lugar esto útil.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top