Google Maps API - 奇怪的地图“偏移”行为

Question

我正在网页上的表单旁边添加地图。这个想法是人们可以注册，当他们输入他们的地址并点击搜索时，它会标记他们的房子，他们必须在提交表单之前这样做（地理定位在我的网站上扮演着重要角色）。

不幸的是，我添加了地图，但在地图窗口中，地图本身似乎是偏移的。请参阅下图以说明我的意思：

我只能从框的“映射”部分中拖动地图。如果我选择灰色区域来拖动地图，它会失败。

有什么可能导致这种情况的想法吗？

编辑：

这是我的地图初始化 Javascript，在页面加载时调用。

    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(52.428385,-3.560257);
    var myOptions = {
      zoom: 7,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("adminMap"), myOptions);

这是我的地图 CSS

#adminMap{
    float:left;
    width:270px;
    height:370px;
    margin-left:20px; 
}

这是我的地图 HTML

<div id="adminMap">
</div>

Answer 1

要在更改 div 可见性时再次完全渲染地图，您可以使用此代码。

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

这将在 div 中重新渲染您的地图并完全显示它。

Answer 2

我见过类似的事情。如果无法访问任何代码，我最好的选择是在隐藏容器 div 时初始化地图。我已经看到导致这样的症状。尝试在显示地图时设置地图，而不是之前设置。