Question

我在我的网站上使用google-maps版本3.

我遇到了地图有时无法加载的问题，但是它会显示为灰色框，浏览器日志会出现错误 - 很遗憾我现在无法获取日志，因为地图正在运行试。

根据一些研究，问题是由于我使用的实验版本

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=false"></script>

有没有办法确定地图是成功加载还是崩溃所以我可以告诉用户很快就会回来？

P.S。我尝试了空闲事件，但即使地图崩溃也会调用它。

Answer 1

转而收听“tilesloaded”事件。这是地图（成功）加载并且您实际显示地图时要触发的最后一个事件。

如果没有地图（例如，您没有明确设置宽度/高度），即使空闲也不会触发此事件。

您可以使用Map Events示例并在“网络”标签中限制连接以进行一些测试。 Here是与#map没有设置宽度/高度的相同示例。

Answer 2

我认为最好或最确定的方法是tilesloaded事件和延迟函数的组合，以测试＆＃34;成功标志＆＃34;已设定。

/* flag to indicate google maps is loaded */
googleMapsLoaded = false;

/* listen to the tilesloaded event
   if that is triggered, google maps is loaded successfully for sure */
google.maps.event.addListener(map, 'tilesloaded', function() {
   googleMapsLoaded = true;
   //clear the listener, we only need it once
   google.maps.event.clearListeners(map, 'tilesloaded');
});

/* a delayed check to see if google maps was ever loaded */
setTimeout(function() {
  if (!googleMapsLoaded) {
     //we have waited 5 secs, google maps is not loaded yet
     alert('google maps is not loaded');
  }    
}, 5000);

Answer 3

在空闲事件中，请在地图对象上执行以下操作：

检查以下内容：

使用if (typeof google === 'object' && typeof google.maps === 'object') {...}检查是否已成功加载。

然后检查if(map.getCenter) { var latlng = map.getCenter(); //check here if latlng is object }

如果任何“IF”条件失败，则表示出现了问题。

如何检测谷歌地图是否已成功加载

3 个答案: