jquery - 第二次以错误的偏移量加载地图

Question

我制作了一个测试页面，您可以在其中检查确切的问题。

第一次点击它显示完美的地图但是当你关闭弹出窗口一次又一次点击gmap然后弹出窗口打开但gmap显示四分之一。

这是测试页面的链接

Answer 1

Init()每次用户单击gmap链接时，您都会调用。这个函数每次都会创建一个谷歌地图。

我看到两种可能的解决方案：

1. 仅在用户第一次打开对话框时创建地图。当用户关闭对话框时，jQuery 实际上隐藏了对话框 div。地图仍然保留在那里，因此当您重新显示对话框时无需创建新地图。（在每次用户单击元素时创建新地图之前var map = null;，全局声明并测试是否map等于。nullgmap

2. 对话框关闭时清理地图 div。

对话框关闭时的清理

尝试使用此代码map在对话框关闭时清理元素：

<script type="text/javascript">
   $('document').ready(function () {
       $("#popup_container").dialog({
           autoshow: false,
           modal: true,
           border: 10,
           width: 500,
           height: 340,
           close: function(event, ui) {
              $('#map').html('');
           }
       });

       $('#gmap').click(function () {
           Init(); // initialize the map
           $("#popup_container").dialog("open");
       });
   });
</script>

另请注意，您需要将参数dialog()作为单个对象传递给方法。