jquery - 带有fancybox的gmaps第二次没有正确显示

Question

我遇到了一些非常奇怪的行为，无法弄清楚为什么......我有一个指向我使用fancybox调用的位置的链接：

  $(".location_modal").fancybox();  

显示位置的代码如下所示：

<div class="event_identifier">
  <div id="map_canvas" style="width:960px;height:500px;"></div>
</div>
<script type="text/javascript" charset="utf-8">
  $(document).ready(function() {
    $("#map_canvas").gmap3();
  });
</script>

我第一次单击链接时，它加载得很好：http ://cl.ly/3X1h1j031W0S0b0t1A3K 关闭fancybox 并再次单击相同的链接后，我得到以下信息：http ://cl.ly/2J1B2G3W1L1i3i033v1X 。地图画布大小相同，但地图本身未正确显示。

我在没有fancybox的情况下尝试了这个，它似乎运行良好，所以我认为这可能是一种冲突。我正在使用最新版本的 gmap3 (3.3)、jquery 1.5.2 和 fancybox 1.3.4。

谢谢！

Answer 1

谷歌地图可能会因为它自己创建和设置然后你删除它而感到困惑，当它重新创建时它认为它不需要重新创建自己，因为变量仍在内存中。

尝试像很多人一样将地图放在单独的 iFrame 中。