3

可能重复：
Reveal Modal 中的 Google Map API 未完全显示

我有一个位于 Reveal Modal 中的 Google Map API。对于那些不知道那是什么的人来说，它基本上是一个隐藏的容器，当单击按钮时会弹出。我在这个显示模式中有谷歌地图 API，它正在显示，但没有显示所有地图，它只显示了三分之一。

如何让整个地图显示？

我的页面的链接： http: //simplicitdesignanddevelopment.com/Fannie%20E%20Zurb/foundation/contact_us.html#

单击 GOOGLE 地图按钮查看手头的问题

显示模态脚本：

<script type="text/javascript">
$(document).ready(function() {
$('#myModal1').click(function() {
$('#myModal').reveal();
});
});
</script>

包含 Google Map API 的 Div

<div id="map_canvas" style="width:600px; height:300px;"></div>
<a class="close-reveal-modal">&#215;</a>
 </div>

单击时显示谷歌地图的按钮

<div class="five columns">
  <ul class="button-group even three-up" id="contact-button-group">
    <li><a href="#" class="button" data-reveal-id="myModal">Google Map</a></li>
    <li><a href="#" class="button">Button 2</a></li>
    <li><a href="#" class="button">Button 3</a></li>
  </ul>
</div>
4

1 回答 1

5

显示模态后，使用google.maps.event.trigger(map, 'resize')其中“地图”是地图的实例。

于 2012-10-24T20:23:55.523 回答