如何检查Google地图是否已满载？

Question

我正在将Google地图嵌入我的网站.加载Google地图后,我需要启动一些JavaScript流程.

有没有办法在Google地图完全加载时自动检测,包括平铺下载等等？

tilesloaded()应该存在一种方法,它应该完成这项任务,但它不起作用.

Answer 1

GMaps v3让我困扰了一段时间.

我找到了这样做的方法:

google.maps.event.addListenerOnce(map, 'idle', function(){
    // do something only the first time the map is loaded
});

当地图进入空闲状态时会触发"空闲"事件 - 所有内容都已加载(或无法加载).我发现它比tilesload/bounds_changed更可靠,并且使用addListenerOnce方法,闭包中的代码在第一次触发"idle"时执行,然后事件被分离.

另请参阅Google地图参考中的事件部分.

Answer 2

我创建HTML5的移动应用和我注意到idle,bounds_changed和tilesloaded事件触发创建和渲染(即使它是不可见的)地图对象时.

为了使我的地图在第一次显示时运行代码,我执行了以下操作:

google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
    //this part runs when the mapobject is created and rendered
    google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
        //this part runs when the mapobject shown for the first time
    });
});

Answer 3

如果您使用的是Maps API v3,则会发生变化.

在版本3中,您基本上想要为bounds_changed事件设置一个侦听器,该侦听器将在映射加载时触发.触发后,删除侦听器,因为每次视口边界更改时都不希望被通知.

随着V3 API的发展,这可能会在未来发生变化:-)

Answer 4

如果您正在使用Web组件,那么他们将此作为示例:

map.addEventListener('google-map-ready', function(e) {
   alert('Map loaded!');
});

Answer 5

在2018年：

var map = new google.maps.Map(...)
map.addListener('tilesloaded', function () { ... })

https://developers.google.com/maps/documentation/javascript/events

Answer 6

GMap2::tilesloaded() 将是您正在寻找的事件。

请参阅GMap2.tilesloaded以获取参考。