1

好的，我已经到处寻找解决方案。我发现的一切都不太正常。这是一个类似的问题，谷歌地图没有出现在使用 jquery 选项卡的隐藏 div 中。但是，当导航到另一个选项卡并返回 Chrome、Firefox、Opera 和 Safari 时，我可以正确加载地图并保持缩放。

所以我的问题像往常一样是IE。

我设置它的方式是最初隐藏 div，然后显示它并加载到 iframe 中，其中包含地图代码。正如我所说，它在除了 IE 之外的所有设备上都可以正常工作，它在左侧角落加载地图而没有调整大小的能力。我假设这取决于 IE 处理 javascript 的方式。我在这里尝试了很多建议，但在 IE 中都失败了，所以想知道以前是否有人遇到过这个问题以及是否有任何解决方法可用。

下面的代码是初始化地图。对函数的调用是页面中结束 html 标记之后的最后一件事。

然后，当按下 ui.tab 以更改显示的 div 面板时，此页面会通过 iframe 加载到 div 标记中。

任何线索或提示都将受到欢迎。

function initialize() {
  var myLatlng = new google.maps.LatLng(50.66416319854267,-1.1316803097724914);

  var myOptions = {
     zoom: 10,
     center: myLatlng,
     mapTypeId: google.maps.MapTypeId.SATELLITE
     }
 var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

  var marker = new google.maps.Marker({
  draggable: false,
  position: myLatlng, 
  map: map,
  icon: '../images/yellow-pin.png',
  title: ""
  });
  google.maps.event.trigger(map, 'resize'); // added from another forum post does not work
}
4

1 回答 1

0

这就是典型的隐藏“左上角”问题。

您是否尝试过使用 onload 函数来运行初始化函数？

问题是 iframe 中的 javascript 代码（触发器“resize”）在页面加载时执行，而不是在显示时执行。加载时，div 的大小为零。您需要在 div 显示并具有大小后在地图上触发 resize 功能。

于 2012-10-18T16:02:15.740 回答