Jquery Google地图没有完全加载到modal上

我正在使用GoogleMap和jQuery2.1.0库以及OpenClose模式

当我将#map放入#main div时，它工作正常。但当我将#map放入#modal div时，它并没有完全加载

这里是html

<div id="main">
    <div class="inner">
        <a href="#" id="modal-open">Open</a>
    </div>
</div>
<div id="modal">
    <div class="inner">
        <a href="#" id="modal-close">Close</a>
                  <div id="map_canvas" style="height:300px; width:600px;"></div>
    <!-- The element that will contain our Google Map. This is used in both the Javascript and CSS above. -->   
    </div>            
</div>

我的例子如下：

---

最好在使元素可见后初始化Google Maps，因为Maps API使用有关元素的信息来指示布局。如果元素不可见，则大小信息不可靠，并且创建的贴图在使其可见时看起来不正确

此外，尽管这意味着用户请求地图时可能会有延迟，但这意味着您不会尝试为未请求地图的用户加载地图

因此，请删除以下内容：

google.maps.event.addDomListener(window, 'load', init);

---

而是从

$（“#modal open”）中调用
init（）
。在（'click'

handler-）上，使元素可见后。（是的，这意味着您可能想重新考虑动画，因为那里没有任何东西需要“淡入”。

感谢您的回答和信息。但是我如何调用init（）函数？