容器大小调整后如何在此处重绘地图? [英] How to redraw Here Map when container resizes?

问题描述

我今天遇到了一个从未遇到过或未曾注意到的特殊问题.在Here Heres Maps 3.0中设置地图时，我注意到，如果在加载地图时浏览器窗口小"(小于全屏)，则即使将浏览器窗口调整为全屏.

I hit a peculiar problem today which I haven't encountered or noticed before. While setting up a map in Here Maps 3.0, I noticed that if the browser window is "small", less than a full-screen one, during loading the map, also the map will stay small even if the browser window will be resized to a full-screen one.

如何更新这里地图"地图大小以占据分配的空间?

How could I update the Here Maps map size to occupy as much space as allotted?

我的安排如下，我想知道这样做的原因是否可能是相对的div.之所以要使用它们，是因为我正在尝试设计具有页眉，页脚以及其他带有和不带有滚动条的文本的设计(如果页面上存在滚动条，则滚动地图看起来有些抖动).

My arrangement is as follows and I wonder if the reason for this could be the relative divs. The reason I have them is that I'm experimenting with designs that have headers, footers, other text with and without scrolls bars (and it looks like scrolling the map gets a bit jittery if there's a scrollbar present on the page).

<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>

推荐答案

在地图对象初始化之后尝试以下操作:

try this after the map object initialization:

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

那应该可以解决问题.

这篇关于容器大小调整后如何在此处重绘地图?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！