2

我在使用 Google Maps Javascript API 时遇到了一个奇怪的问题。当使用 fitBounds() 方法时，webkit 浏览器在某些缩放级别之间缩放时会为平移和缩放设置动画。这很好，但是当使用“叠加地图类型”时，有时不会显示原始地图图块。我无法在较小的显示器上重新创建它，所以我认为它与大地图画布有关。

我制作了一个简单的示例页面，该页面几乎是从 API 文档中复制而来的。为了重现问题：

1) 使用大显示器在 Chrome（Mac 或 Windows 上）中打开http://pastehtml.com/view/cqloxyo5v.html，并确保窗口最大化。我用的是 24"。

2) 按“点击我！” 左下角的按钮触发 fitBounds() 方法，其中两个坐标位于地图范围之外。

3) 地图将动画以适应坐标，一些地图图块将变为空。如果没有动画，您的浏览器窗口可能太小了。如果它确实动画但瓷砖看起来不错，请更新页面并再次尝试几次。它似乎偶尔发生。

这就是我的样子：https ://vimeo.com/58366640

有人遇到过类似的事情吗？有什么办法可以禁用动画吗？

先感谢您！

4

3 回答 3

0

另一个复制链接：http ://tinyurl.com/baqvppr

这似乎是一个 Chrome 错误。由于某种原因，Chrome 的 GPU 内存不足。您可以在这里为这个问题投票： https ://code.google.com/p/chromium/issues/detail?id=175549

在此处输入图像描述

于 2013-02-13T13:21:37.580 回答
0

This is a known issue, there are a lot of requests to give an option to disable the animation.

I didn't notice the behaviour as shown in the video, but for me the zooming-animation is a very unsightly process when switching between very high and very low zoom-levels.

I don't know if it would be an option in your case and if it will fix the issue, but I've found a possible workaround in OpenLayers, where it's possible to avoid the animation in Google Maps. They simply hide the complete map-container and show the container when the process has been finished.

In your case this would be:

  $().ready(function() {
      $("#clickButton").click(function() {
        var bounds = new google.maps.LatLngBounds();
        bounds.extend(new google.maps.LatLng(49.0, 2.55));
        bounds.extend(new google.maps.LatLng(35.55, 139.78));
        var mapDiv=map.getDiv();
        map.fitBounds(bounds);
        google.maps.event.addListenerOnce(map,'tilesloaded',
                                          function(){mapDiv.style.visibility=''});
        mapDiv.style.visibility="hidden";
      });
  });
于 2013-01-28T20:22:14.167 回答
0

碰巧我需要稍微平移我的地图以显示所有标记。除了解决这个问题外，地图停止了各种缩放的动画。效果并不完全是人们想要的（地图变为空白，然后标记缩放到它们的位置，然后显示具有新范围的地图），但它对我的需要更好，也许对你更好。这是在地图上放置标记的函数的底部：

map.fitBounds(latlngbounds);
//This minimum zoom trick I got from StackOverflow:
google.maps.event.addListenerOnce(map, 'bounds_changed', function(event){
    if (this.getZoom() >= 5){  
        this.setZoom(5) 
        }
    }); 
map.panBy(1,0);
于 2016-02-11T07:13:53.087 回答