Question

我今天遇到了一个特殊的问题，我以前没有遇到或注意过。在Here Maps 3.0中设置地图时，我注意到如果浏览器窗口小于＆＃34;，小于全屏，则在加载地图期间，即使浏览器，地图也会保持较小窗口将调整为全屏幕。

我如何更新Here Maps地图大小以占用分配的空间？

我的安排如下，我想知道这可能是相对div的原因。我拥有它们的原因是我正在试验具有页眉，页脚，带有和不带滚动条的其他文本的设计（如果滚动条存在于滚动条上，看起来滚动地图会有点紧张页）。

<style type="text/css">
    #mapContainer {
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        position: absolute;
        background: grey;
    }

    #main {
         position: relative;
         width: 100%;
         height: 100%;
    }

    html, body {
        overflow-y: hidden;
    }    
</style>

<div id="main">
    <div id="mapContainer"></div>
</div>

Answer 1

在地图对象初始化后尝试此操作：

window.addEventListener('resize', function () {
    map.getViewPort().resize(); 
});

那应该可以解决问题。

Answer 2

支持提到的窗口调整大小事件似乎是主要方法。但是，在模板化页面中，窗口调整大小事件有时会发生得太快，而resize（）调用则没有正确的大小调整 - 此时您可能需要为模板库找到'AfterRender'事件，或者失败从resize事件设置超时，为元素调整大小完成的机会。

如何在容器调整大小时重绘这里的地图？

2 个答案: