Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/google-maps/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 添加侦听器时未加载Google Maps V3映射_Javascript_Google Maps_Google Maps Api 3 - Fatal编程技术网

Javascript 添加侦听器时未加载Google Maps V3映射

Javascript 添加侦听器时未加载Google Maps V3映射,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,我正在尝试向谷歌地图添加一个空闲的侦听器 问题:当我如下图所示添加侦听器时,出现错误无法读取未定义的属性“\uuuue3” JS代码 google.maps.event.addListener(map, 'idle', function() { console.log('hello'); } 我通过添加一个setTimeout(…,1000)来解决这个问题,以确保映射在一秒钟后加载 问题: 该错误是由于未加载地图造成的吗 这是解决问题的最好办法吗 这个问题会发生吗?我猜

我正在尝试向谷歌地图添加一个
空闲的
侦听器

问题:当我如下图所示添加侦听器时,出现错误
无法读取未定义的属性“\uuuue3”

JS代码

google.maps.event.addListener(map, 'idle', function() {
            console.log('hello');
}
我通过添加一个
setTimeout(…,1000)
来解决这个问题,以确保映射在一秒钟后加载

问题

  • 该错误是由于未加载地图造成的吗
  • 这是解决问题的最好办法吗
  • 这个问题会发生吗?我猜想,如果我在没有其他代码的情况下将同一个侦听器添加到map,则不会弹出此错误
  • 编辑

    地图初始化

    <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>
    
    
    var映射;
    var地理编码器;
    var directionsService=new google.maps.directionsService();
    函数初始化(){
    var center_latlng=新的google.maps.latlng(42.354183,-71.065063);
    变量选项={
    缩放:15,
    minZoom:11,
    maxZoom:19,
    中心:中心,
    mapTypeId:google.maps.mapTypeId.ROADMAP
    };
    map=new google.maps.map(document.getElementById(“map_canvas”),选项);
    变量样式=[
    {
    特征类型:“poi”,
    elementType:“标签”,
    样式:[
    {可见性:“关闭”}
    ]
    },{
    特色类型:“景观”,
    elementType:“标签”,
    样式:[
    {可见性:“关闭”}
    ]
    }
    ]
    setOptions({Style:Style});
    geocoder=新的google.maps.geocoder();
    //标记聚类器
    var styles={styles:[{
    身高:34,
    url:“images/template/markers/cluster.png”,
    宽度:34,
    textColor:“#FFF”,
    文本大小:12
    },
    {
    身高:56,
    url:“http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m2.png",
    宽度:56
    },
    {
    身高:66,
    url:“http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m3.png",
    宽度:66
    },
    {
    身高:78,
    url:“http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m4.png",
    宽度:78
    },
    {
    身高:90,
    url:“http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/images/m5.png",
    宽度:90
    }]
    };
    var mcOptions={gridSize:50,maxZoom:15,styles:styles['styles']};
    mc=新的MarkerClusterer(映射,[],mcOptions);
    }
    
    1。)不完全是这样,发生这种类型的错误是因为您试图访问一个在尝试连接侦听器时不存在的对象。侦听器代码必须附加在map变量包含googlemap对象之后。您何时尝试连接侦听器?我在初始化代码中没有看到它

    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');
        });
    }
    

    下面是对上述代码的处理:

    您能提供一些上下文吗?例如,如何以及何时初始化映射?@NiklasRingdahl我已经更新了代码,请看一看:)我在
    $(function(){…})中添加了侦听器使用jQuery,以便在加载DOM后加载侦听器,而不是在初始化GoogleMaps后加载侦听器。你是对的,我应该把它添加到initialize()函数中