Google地图不会检测动态调整大小时更改的边界

Question

我有一个AJAX地图查询功能，只要页面加载或拖动或缩放地图（500x500px）时就会触发：

google.maps.event.addListener(map, 'idle', function () {

 var bounds = map.getBounds();
 // do something

});

我还有一个按钮，可以触发此地图的大小调整到浏览器窗口的范围。点击后，我意识到地图边界仍然是500x500px，即使地图延伸到整个窗口，导致地图图块未完全加载。

以下是调整大小的部分代码：

$(document).ready(function() {
 $('button').click(function() {
  $('#map').css({'height': new_height, 'width': new_width});
 }
});

拖动地图并不能解决问题。仅当我单击浏览器的最大化/恢复按钮时，Google Map才会检测新的地图边界。如何在没有人工努力的情况下解决这个问题？

Answer 1

您可以尝试：

$(document).ready(function() {
    $('#button').click(function() {
        $('#map').css({'height': new_height, 'width': new_width});
        google.maps.event.trigger(map, 'resize');
    });
});