我有一个相当复杂的 map 应用程序,可以处理多个自定义标记等。我有一个名为 resizeWindow 的函数,每当屏幕更改时,我都会在监听器中调用该函数, map 会通过计算新边界并强制调整大小来重新绘制自身。它看起来像这样:
window.onresize = function(event) { fitmap(); };
调整大小的函数是:
function fitmap(id) {
var coords = [];
var newlatlng = new google.maps.LatLng(projlat, projlng);
coords.push(newlatlng);
for (var i=0; i<markers[id].length; i++) {
newlatlng = new google.maps.LatLng(markers[id][i].latitude, markers[id][i].longitude);
coords.push(newlatlng);
}
}
var bounds = new google.maps.LatLngBounds ();
for (var i = 0, LtLgLen = coords.length; i < LtLgLen; i++) {
bounds.extend (coords[i]);
}
map.fitBounds(bounds);
当我实际调整窗口大小时,这非常有用。但是...
窗口右侧有一个菜单。我使用 jquery.animate 将该菜单移出屏幕。我将 fitmap 函数称为一个步骤过程(或仅在最后一次),并且它不会重绘 map 。
$('#rightSide').animate({ right:"-240px" }, {
duration:1000,
step: function(now,fx) {
fitmap();
}
});
我已经阅读并阅读了此内容,似乎 Google Maps API v3.0 有一个奇怪的地方,即如果实际上没有任何更改,则不会发生重绘。在这种情况下,我的可用窗口确实从屏幕宽度 - 菜单更改为实际全屏。但没有发生重绘。
我尝试过 google.maps.event.trigger(map, 'resize');那也行不通。
有没有办法绝对强制 Google map 重绘?
最佳答案
google.maps.event.trigger(MapInstance,'resize')
对我来说工作正常,将其放在函数 fitMap
的开头。
你缺少什么:
目前(不是在上面发布的代码中,而是在您的实时代码中),您在每个 step
上调用 resizeWindow
。
当您在步骤
上调用此函数时,该函数将在当前步骤的动画完成之前调用。结果是当完整的动画完成时,resizeWindow
将不会被调用,例如 map 右侧的边距。
解决方案:也在动画
的complete
回调上调用resizeWindow
。
关于jquery - 如何使用 Google Maps API v3.0 强制重绘?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18426083/