javascript - What is causing a Google Maps error in IE8? - Stack Overflow

admin管理员组

文章数量:1294384

We are using Google Maps and have identified an issue that only seems to happen in IE8 (and possibly below). The functionality works correctly in FF, Chrome, IE9.

The code that the error happens around is:

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( );

In particular on this line:

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

and the error is:

Object doesn't support this property or method

I've had a bit of a play with the IE dev tools and if I replace map = with something like var x = there isnt any error, so this leads me to believe that the map object is the culprit that is missing some property/method. Although I don't really know where the map object es from, I assume it gets loaded from the google.load call.

Does anyone know what is going on here?

We are using Google Maps and have identified an issue that only seems to happen in IE8 (and possibly below). The functionality works correctly in FF, Chrome, IE9.

The code that the error happens around is:

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( );

In particular on this line:

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

and the error is:

Object doesn't support this property or method

I've had a bit of a play with the IE dev tools and if I replace map = with something like var x = there isnt any error, so this leads me to believe that the map object is the culprit that is missing some property/method. Although I don't really know where the map object es from, I assume it gets loaded from the google.load call.

Does anyone know what is going on here?

• javascript
• google-maps-api-3
• internet-explorer-8

Share Follow edited May 24, 2012 at 20:19 gowansg 79511 gold badge88 silver badges1515 bronze badges asked May 23, 2012 at 23:46 Daniel PowellDaniel Powell 8,3031212 gold badges6363 silver badges108108 bronze badges 1

• 2 See: stackoverflow./questions/9158238/… – Chris Johnson Commented May 24, 2012 at 0:43

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

When the line:

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

gets executed the JavaScript interpreter will start traversing up the scope chain looking for where map is declared. Since it's not declared locally, i.e. var map = ..., it doesn't find it in your local scope, and it ultimately gets added to the global scope.

In your case map is already defined in the global scope as window.map because, it's the Id of a div on your page. In all the browsers you don't see an error message, window.map is set to a new google.maps.Map object. For some reason, good or bad, IE8 won't let you create a global variable whose name conflicts with an existing global variable that refers to a DOM element.

You could resolve this several different ways:

1. Create a local var map
2. Change the id of your div from map to something else

3. If you have to have map exist in global scope, set it using window.map =...

   (3b) Change the variable name to be one that doesn't conflict with window.map, e.g. myMap = new google.maps.Map(...

本文标签： javascriptWhat is causing a Google Maps error in IE8Stack Overflow