使用JavaScript实时函数动态创建Google地图时，地图会变成半灰色。

Question

我们的代码以live函数开始，整个页面内容都是由js live函数创建的。下面的代码用于在javascript代码中创建谷歌地图，在第一次创建时一切正常（地图在屏幕上显示正确），但之后当在同一页上再次创建谷歌地图时，地图的一半会出现，另一半则是灰色的，这就是我们的问题。

JQuery版本为1.8.0

Bootstrap版本为2.2.2

var idz = 'mapg';
tr.append($('<td>').append($('<div>', {
'id': idz,
'style': 'width: 100%; height: 300px'
})));
var latlng = new google.maps.LatLng(40.988921, 29.021326);
var options = {
   zoom: 10,
   center: latlng,
   mapTypeId: google.maps.MapTypeId.ROADMAP
};
rootMap = new google.maps.Map(document.getElementById(idz), options);

我需要在这个问题上得到帮助，提前感谢。

- odincer

Answer 1

我也遇到了同样的问题，我通过触发Google地图的resize来解决它。

下面是代码：

google.maps.event.trigger(rootMap , 'resize'); //For v3

在初始化谷歌地图之后添加此代码。

您可以查看这个SO问题。

- Praveen

---

通过您的回复和以下代码，我们解决了问题，谢谢。google.maps.event.addListenerOnce(rootMap, 'idle', function(){ google.maps.event.trigger(rootMap , 'resize'); }); - odincer