¿Qué está causando un error de Google Maps en IE8?

Question

Estamos usando Google Maps y hemos identificado un problema que solo parece ocurrir en IE8 (y posiblemente más abajo). La funcionalidad funciona correctamente en FF, Chrome, IE9.

El código que el error sucede a su alrededor es:

google.load("maps", "3.x", { other_params: "sensor=false" }); 
    var mapdiv = null; 
    $(function() { 
     mapdiv = document.getElementById("map"); 
     map = new google.maps.Map(mapdiv, { 
      zoom: 1, 
      center: new google.maps.LatLng(6, 35), 
      disableDefaultUI: true, 
      mapTypeId: google.maps.MapTypeId.TERRAIN 
     }); 
     var latlngbounds = new google.maps.LatLngBounds(); 

En particular, en esta línea:

map = new google.maps.Map(mapdiv, { 
    zoom: 1, 
    center: new google.maps.LatLng(6, 35), 
    disableDefaultUI: true, 
    mapTypeId: google.maps.MapTypeId.TERRAIN 
}); 

y el error es:

objeto no acepta esta propiedad o método

He tenido un poco de juego con las herramientas de desarrollo IE y si reemplazo map = con algo como var x = no hay ningún error, entonces esto me lleva a creer que el objeto map es el culpable de que falta alguna propiedad/método . Aunque realmente no sé de dónde viene el objeto map, supongo que se carga desde la llamada google.load.

¿Alguien sabe lo que está pasando aquí?

Answer 1

Cuando la línea:

map = new google.maps.Map(mapdiv, { zoom: 1, center: new google.maps.LatLng(6, 35), disableDefaultUI: true, mapTypeId: google.maps.MapTypeId.TERRAIN }); 

es ejecutado el intérprete de JavaScript se empezará a atravesar la cadena de ámbito buscando donde map se declara. Como no se ha declarado localmente, es decir, var map = ..., no lo encuentra en su ámbito local y, en última instancia, se agrega al alcance global.

En su caso map ya está definido en el alcance global como window.map porque, es el Id. De div en su página. En todos los navegadores no aparece un mensaje de error, window.map se establece en un nuevo objeto google.maps.Map. Por alguna razón, buena o mala, IE8 no le permitirá crear una variable global cuyo nombre entra en conflicto con una variable global existente que se refiere a un elemento DOM.

Se podría resolver esto varias maneras diferentes:

1. Crear un local de var map
2. cambiar el ID de la div de map a algo más

3. Si usted tiene que tener map existen en el ámbito global , configúrelo usando window.map =...

   (3b) Cambie el nombre de la variable para que sea uno que no entre en conflicto con window.map, p. myMap = new google.maps.Map(...