javascript - 启动时虚拟地球 map 不显示为显示 :none

Question

我有这段代码可以使用 Virtual Earth API 显示 map :

<script type="text/javascript">
    function GetMap() {
        var map = map = new VEMap('myMap');
        map.LoadMap(new VELatLong(47.6, -122.33), 10, 'h', false);
    }

    $(document).ready(function () {
        GetMap();
    });
</script>

<a href="#" onclick="$('#myMap').toggle();">Show Map</a>
<div id="myMap" style="position:relative; width:400px; height:400px; display:none;"></div>

这不起作用，并在 map 应该去的地方显示一个黑框。如果我删除 display: none; 样式，那么它就可以正常工作。但我不希望 map 在页面加载时可见，我希望用户切换它。谁能看出我的方法有什么问题吗？

Answer 1

也许 map 需要在初始化时显示出来。如果 map 必须测量容器的尺寸才能正确呈现，这种情况尤其会发生。

要么按照 Diodes 的建议将 map 移出可视区域(您也可以将可见性设置为 false)，要么在实际需要显示时初始化 map 。