En el trabajo estoy haciendo una aplicación web que muestra mapas usando la API de Google Maps. Tras una revisión, el cliente, que usaba IE6, nos dijo que los mapas no siempre aparecían. Lo comprobé y efectivamente en ese maldito navegador a veces el mapa se quedaba en gris y había que "forzarle" a que siguiera cargando las imágenes, haciendo scroll, zoom o cambiando a mapa satélite, etc. También observé que se arreglaba si se pulsaba el botón de tipo de mapa (carreteras/satélite/físico) una vez más, aunque ya estuviera seleccionado. Y podía fallar de nuevo al cambiar el tipo del mapa.
Tras buscar por Internet y no encontrar una solución, decidí emular ese mismo "apaño" pero con Javascript. El resultado fue este código, que hay que hacer que se ejecute tras la carga de la página (usando
onLoad, o la función
$() si usamos
jQuery, como es mi caso):
function hackMapaEnIE(map) {
/*@cc_on
@if(@_win32)
var ieSucks = 1;
setTimeout(function() { map.setMapType(map.getCurrentMapType()); }, 100);
GEvent.addListener(map, 'maptypechanged', function() {
if(ieSucks == 4)
ieSucks = 1;
else {
ieSucks++;
setTimeout(function() { map.setMapType(map.getCurrentMapType()); }, 100);
}
});
@end
@*/
}El parámetro
map que hay que pasar a la función es el objeto
GMap2 que queramos "arreglar". Lo que hace esta función es intentar hasta 4 veces (separadas una décima de segundo) que el mapa se termine de cargar, estableciendo su
mapType al mismo que ya tenía seleccionado. Las instrucciones
@cc_on,
@if y
@end son para que
sólamente Internet Explorer ejecute este código. Los demás navegadores lo ven como un bloque de comentario. También podría haber usado, por ejemplo,
comentarios condicionales en HTML. Eso ya es a gusto de cada uno :)
El apaño mejoró bastante el problema, aunque no se solucionó del todo. Más o menos, una de cada 20 veces que uno cambia el tipo de mapa, se vuelve a producir el problema. Quizás aún se puede ajustar el tiempo de espera o el número de intentos, pero de momento algo es algo. Si alguien conoce una solución definitiva, agradecería que me la pusiera en un comentario…
Actualización: Finalmente
Camvoya encontró la verdadera raíz del problema:
la culpa era del iepngfix. Para arreglarlo bastó con añadir la siguiente línea de CSS (y quitar el código Javascript que puse más arriba, que ya no hace falta):
#map img { behavior: none; }
Misterio solucionado, ahora funciona perfectamente. ¡Gracias!
