【发布时间】：2013-08-16 15:11:56
【问题描述】：
我在获取地图以在窗口加载时进行初始化时遇到了困难。这个问题与this question 基本相同，除了我已经没有使用任何 jQuery 来创建地图，因此那里提出的解决方案不适用于我。我的代码如下：
function initialize() {
var mapOptions = {
zoom: 14,
center: new google.maps.LatLng(43.703918,-79.422789),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('location-canvas'),
mapOptions);
var marker = new google.maps.Marker({
map: map,
draggable: false,
position: new google.maps.LatLng(43.703918,-79.422789)
});
}
google.maps.event.addDomListener(window, 'resize', initialize);
google.maps.event.addDomListener(window, 'load', initialize);
加载时，地图显示偏离中心，缺少地图图块，但如果我调整窗口大小甚至一个像素，它就会自行纠正。
编辑：我正在使用这个 CSS/Javascript 框架：nacodes.com/2013/04/23/Fullscreen-Layout-with-Page-Transitions 问题似乎是在绘制时，地图 div 是尺寸不正确。一旦达到全尺寸，屏幕调整大小会立即修复它。但是第一次抽签是有问题的。我花了一个下午的时间试图弄清楚是否有一种好方法可以决定何时在 CSS 转换后重新初始化地图，而不会导致其他问题。
【问题讨论】：
-
你的 HTML 是什么样的？它有效吗？您可能应该在初始化函数内的地图上触发 google maps resize 事件。发布的代码对我来说很好（根据需要使用 HTML）。
-
@geocodezip 我正在使用这个 CSS/Javascript 框架：nacodes.com/2013/04/23/Fullscreen-Layout-with-Page-Transitions 问题似乎是在它被绘制的时候，地图 div 的大小不正确。一旦达到全尺寸，屏幕调整大小会立即修复它。但是第一次抽签是有问题的。我花了一个下午试图弄清楚是否有一种好方法来决定何时在 CSS 转换后重新初始化地图，而不会导致其他问题。例如，如果我在 webkitTransitionEnd 上执行此操作，它会重绘 9 次，并在我的移动浏览器上永远重绘。
-
请用任何细节更新您的问题，很难阅读 cmets 中的大量信息。我建议在您的页面呈现后触发地图调整大小事件（如the documentation、
resize | Developers should trigger this event on the map when the div changes size: google.maps.event.trigger(map, 'resize');中的建议）。
标签： javascript google-maps-api-3