谷歌地图加载奇怪

我用我的网站上的谷歌地图API（V3），以显示在某一位置为中心的地图。谷歌地图加载奇怪

这是我的代码：

<script type="text/javascript"> 
$(document).ready(function() { 
    var latlng = new google.maps.LatLng(-22.924484, -43.208001); 
    var map = new google.maps.Map(document.getElementById("map-property2"), { 
     zoom: 13, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 
}); 
</script>

在我<head>结束时，我有：

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>

这里的结果：

alt text

正如你可以看到它的像那里有两个地图..但是如果我是调整地图固定的窗口大小！

还有另外一个问题：在地图的最左上角？这是的位置latlng变量 ..这应该是地图的中心，但它作为左上角加载。：/

诗：没有错误或我的Firebug的JS控制台上的警告。

我发现这里的解决方案：Major Google Maps glitch using API V3

和测试它，我发现了另一件事：我想上加载一个隐藏的div（而不是地图画布的地图，但是有它的容器），当我点击一个标签菜单时显示。

如果地图负载（使用setTimeout）时的标签是有源和容器是可见的，在地图上的负载确定。

我要去疯了...真的。

来源

2010-12-02 Thiago Belem

问题是因为......是负载显示我的解决方案选项卡后，地图无法加载与隐藏在容器中的地图，使用此代码：

$('ul.tabs li a[rel="location"]').click(function() { 
    setTimeout(function() { 
     var latlng = new google.maps.LatLng(-22.924484, -43.208001); 
     var map = new google.maps.Map(document.getElementById("map-property2"), { 
      zoom: 15, 
      center: latlng, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }); 

     var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
      title: "Property location" 
     }); 
    }, 500); 
});

来源

2010-12-02 23:58:44

我知道你已经已经找到了答案，但我发现2个有趣的解决方案：

Problems with Google Maps API v3 + jQuery UI Tabs

Keep a Google Maps v3 Map hidden, show when needed

来源

2010-12-03 00:09:11

如果你有一个地图在一个隐藏的div中，然后决定显示你需要在地图上触发resize事件的div。

google.maps.event.trigger(map, 'resize');

来源

2010-12-03 04:10:05 skarE

谷歌地图加载奇怪

回答

相关问题