fitBounds()显示整个地球(如果地图首先隐藏然后显示)

Question

我有一堆或多个标记,我想只显示包含它们的区域.我找到了一长串相似的问题(请参阅帖子底部的部分内容),但没有一个解决方案适合我.LatLngBounds是正确构建的,但是当我调用fitBounds时,结果如下: 代替: 任何人都可以在我的代码中发现明显的错误吗？

var opt = {
    zoom: 8,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map"),opt);
var box = new google.maps.LatLngBounds();
for(var i=0;i<list.length;i++){
    var p = new google.maps.LatLng(list[i].lat,list[i].lon);
    var marker = new google.maps.Marker({
        position: p,
        map: map
    });
    box.extend(p);
}
map.fitBounds(box);
map.panToBounds(box);

我读过并试过的一些帖子(列表不全面):

• Google Maps v3 - 自动缩放级别？
• 谷歌地图V3自定义标记图像和fitBounds()
• 带有fitBounds的Google地图不会缩放
• Google地图中的fitbounds()api V3不适合边界

---

编辑:如果(就像我在我的应用程序中那样)地图首先被隐藏,并且仅在稍后显示,这实际上会发生.我用这种方式隐藏它:

$('#map').hide();

并显示它:

$('#map').show(function(){
  //this is necessary because otherwise
  //the map will show up in the upper left corner 
  //until a window resize takes place
  google.maps.event.trigger(map, 'resize');
});

有关为什么会发生这种情况以及如何防止它的任何线索(除了在首次显示时初始化地图)？

在旁注中,如果我在声明地图对象时设置了缩放和居中(即我不使用fitBounds()),那么即使在隐藏/显示之后地图也会正确显示.但是,我不能设置缩放和居中,因为点列表在其他地方被检索,我不知道它们在哪里.

Answer 1

解决了(虽然不是很好).我最终做的是LatLngBounds在加载页面时初始化点数,但仅在显示地图时进行平移和缩放.这样它就能正常工作.例如

var box;
function init(){
  var opt = {
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById("map"),opt);
  box = new google.maps.LatLngBounds();
  for(var i=0;i<list.length;i++){
      var p = new google.maps.LatLng(list[i].lat,list[i].lon);
      var marker = new google.maps.Marker({
          position: p,
          map: map
      });
      box.extend(p);
  }
}

然后,稍后(点击一个按钮)

function showMap(){
  $('#map').show(function(){
    google.maps.event.trigger(map, 'resize');
    map.fitBounds(box);
    map.panToBounds(box);
  });
}

它有效,但我不喜欢让那个全局变量悬而未决.我使用OpenLayers实现完全相同的行为,它可以正常工作,而不需要这个hack.如果有人有更好的解决方案,请发布,如果有效,我会接受.

感谢@Engineer和@Matt Handy帮助我消除了一个可能的错误来源.