Question

我正在尝试向谷歌地图添加idle收听者。

问题：当我添加如下所示的监听器时，收到错误Cannot read property '__e3_' of undefined

JS代码

google.maps.event.addListener(map, 'idle', function() {
            console.log('hello');
}

我通过添加setTimeout(..., 1000)解决了这个问题，以确保地图在一秒后加载。

问题：

是否由于地图未加载导致错误？
这是解决问题的最佳方法吗？
这个问题应该发生吗？我猜测如果我在没有其他代码的情况下添加这个相同的侦听器，则不会弹出此错误。

修改

初始化地图

<script type="text/javascript">
var map;
var geocoder;
var directionsService = new google.maps.DirectionsService();

function initialize() {
    var center_latlng = new google.maps.LatLng(42.354183,-71.065063);
    var options = {
        zoom: 15,
        minZoom: 11,
        maxZoom: 19,
        center: center_latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), options);

    var Style = [
      {
        featureType: "poi",
        elementType: "labels",
        stylers: [
          { visibility: "off" }
        ]
      },{
        featureType: "landscape",
        elementType: "labels",
        stylers: [
          { visibility: "off" }
        ]
      }
    ]
    map.setOptions({styles: Style});

    geocoder = new google.maps.Geocoder();

    // Marker Clusterer
    var styles = {styles: [{
                        height: 34,
                        url: "images/template/markers/cluster.png",
                        width: 34,
                        textColor: '#FFF',
                        textSize: 12
                    },
                    {
                        height: 56,
                        url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m2.png",
                        width: 56
                    },
                    {
                        height: 66,
                        url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m3.png",
                        width: 66
                    },
                    {
                        height: 78,
                        url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m4.png",
                        width: 78
                    },
                    {
                        height: 90,
                        url: "http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m5.png",
                        width: 90
                    }]
                };
    var mcOptions = {gridSize: 50, maxZoom: 15,  styles: styles['styles']};
    mc = new MarkerClusterer(map, [], mcOptions);

}
</script>

Answer 1

1。）不完全正确，发生此类错误是因为您尝试访问在尝试附加侦听器时不存在的对象。必须在map变量包含Google地图对象后附加侦听器代码。你什么时候试图附加听众？我没有在初始化代码中看到它。

2.）不，超时不可靠。如果初始化有延迟，则可能仍未按指定的时间间隔初始化地图对象。

3.。）您无法访问不存在的对象的属性。在实例化地图对象之后在init方法中添加侦听器将解决此问题。

var map;

function initialize() {
    var center_latlng = new google.maps.LatLng(42.354183, -71.065063);

    var options = {
        zoom: 15,
        minZoom: 11,
        maxZoom: 19,
        center: center_latlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    //instantiate map object
    map = new google.maps.Map(document.getElementById("map_canvas"), options);

    //attach listener to the map object.
    google.maps.event.addListener(map, 'idle', function() {
        console.log('hello');
    });
}

这是一个有上述代码的工作小提琴：http://jsfiddle.net/R7d6L/

添加侦听器时未加载Google Maps V3 Map

1 个答案: