谷歌地图响应resize

我试图让谷歌地图响应和resize，同时保持其中心的Windowsresize。 我阅读其他堆栈问题，如：

响应Google Map？ 和中心Google地图（V3）浏览器resize（响应）

从第二个堆栈的问题， 我得到了一个链接，帮助我的部分代码，但我仍然没有运气。 这是我使用的代码，当我调整窗口大小时，地图不会resize

function initialize() { var mapOptions = { center: new google.maps.LatLng(40.5472,12.282715), zoom: 6, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); } google.maps.event.addDomListener(window, 'load', initialize); google.maps.event.addDomListener(window, "resize", function() { var center = map.getCenter(); google.maps.event.trigger(map, "resize"); map.setCenter(center); }); 

HTML

  <div id="map-canvas"/> 

CSS

 html { height: 100% } body { height: 100%; margin: 0; padding: 0 } #map-canvas { height: 100% } 

Answer 1

将您的地图variables移动到事件侦听器可以使用的范围中。 您在initialize（）函数内部创build映射，在创build时没有其他任何东西可以使用它。

 var map; //<-- This is now available to both event listeners and the initialize() function function initialize() { var mapOptions = { center: new google.maps.LatLng(40.5472,12.282715), zoom: 6, mapTypeId: google.maps.MapTypeId.ROADMAP }; map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); } google.maps.event.addDomListener(window, 'load', initialize); google.maps.event.addDomListener(window, "resize", function() { var center = map.getCenter(); google.maps.event.trigger(map, "resize"); map.setCenter(center); });