我把谷歌地图嵌入到我的网站。一旦谷歌地图被加载,我需要启动一些JavaScript进程。

有没有办法自动检测当谷歌地图已完全加载,包括瓷砖下载和所有?

存在一个tilesloaded()方法,该方法应该完全完成这个任务,但它不起作用。


当前回答

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

看到GMap2。加载tile供参考。

其他回答

其中变量map是类型为GMap2的对象:

    GEvent.addListener(map, "tilesloaded", function() {
      console.log("Map is fully loaded");
    });

2018年:

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

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

现在你知道地图准备好了没有:

void _onMapCreated(GoogleMapController controller) {
    this.controller = controller;
    _mapIsReady=true; //create this variable
  }

从地图小部件调用此方法

return GoogleMap(
              myLocationEnabled: true,
              //markers: markers,
              markers: Set<Marker>.of(markers.values),
              onMapCreated: _onMapCreated,
              initialCameraPosition: CameraPosition(

                target: _initialPosition,
                zoom: 5.0,
              ),
            );

在我的情况下,瓷砖图像加载从远程url和tilesloaded事件在渲染图像之前被触发。

我用以下肮脏的方法解决了。

var tileCount = 0;
var options = {
    getTileUrl: function(coord, zoom) {
        tileCount++;
        return "http://posnic.com/tiles/?param"+coord;
    },
    tileSize: new google.maps.Size(256, 256),
    opacity: 0.5,
    isPng: true
};
var MT = new google.maps.ImageMapType(options);
map.overlayMapTypes.setAt(0, MT);
google.maps.event.addListenerOnce(map, 'tilesloaded', function(){
    var checkExist = setInterval(function() {
        if ($('#map_canvas > div > div > div:nth-child(1) > div:nth-child(1) > div:nth-child(1) > div:nth-child(2) > div > div').length === tileCount) {
            callyourmethod();
            clearInterval(checkExist);
        }
    }, 100); // check every 100ms
});

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

看到GMap2。加载tile供参考。