从隐藏区域显示谷歌地图答案

【问题标题】：Google map display from a hidden area从隐藏区域显示谷歌地图
【发布时间】：2011-04-16 12:10:31
【问题描述】：

我真的希望有人可以建议从隐藏的 div 中显示谷歌地图。

我有一个谷歌地图，如果用户点击链接，我想向他们展示，即显示地图。

将地图放在隐藏的 div 中根本不起作用，所以我将地图 -1000px 隐藏在位置绝对 css 值上。

这给了我更好的结果，但是当我使用 css 将地图带回来时，只有其中的一部分显示。

谁能给我建议，让我在表演后显示隐藏地图的最佳方式？

希望有人可以提供建议。

谢谢

【问题讨论】：

【解决方案1】：

您不必为绝对位置而烦恼。让 div 隐藏到必要时，然后显示它并调用 google.maps.event.trigger(map, 'resize')(v3) 或 map.checkResize()(v2)

cmets中提到的其他场景：

请确保在致电map.fitBounds() 之前致电google.maps.event.trigger(map, 'resize')，否则您会得到意想不到的结果。

【讨论】：

嘿，谢谢。我为 V2 尝试了 map.checkResize() 并且我得到错误地图未定义。是的，我知道我正在使用 v2。有什么建议吗？
啊，我明白了。我正在使用一个 jQuery 插件。 $.googleMaps.gMap
什么时候调用 google.maps.event.trigger(map, 'resize') ？您可以将其放在单击链接时隐藏（然后显示）的 div 的 onclick 事件上吗？
当然...只要在显示 div 后调用它。如果是动画开场，则在动画完全完成后。
只是想添加到这个......如果你一直在使用 map.fitBounds() 方法，你需要确保在这个触发器之后调用它！

【解决方案2】：

你试过调用地图的resize事件吗？

【讨论】：

【解决方案3】：

为什么不推迟地图的渲染，直到 div 显示出来？

粗略代码：

$("button").click(function() {
   $(mapDiv).show();
   new google.maps.Map(mapDiv, opts);
});

【讨论】：