Google Map iframe隐藏在 <div> 缩放和居中问题

Question

我正使用此Google Map iframe切换代码： http : //jsfiddle.net/cancerian73/T7jLf/20/但此示例有效，因为map iframe具有很多参数。 我正在使用无法使用相同参数的自定义Google我的地图...当我打开iframe时，我的标记位于左上角，并且地图未缩放到可以看到整个大陆的位置。 我该如何进行这项工作？

• 我尝试将地图放在单独的HTML文件中，然后从隐藏的div Iframe调用此位置，我认为如果将地图加载到其他HTML文件中也可以，但是存在相同的问题...
• 我尝试删除display：none并将div大小设置为1px x 1px，但它完全与div切换和周围的内容弄混了...

顺便说一句，因为我为我使用Google Map Iframe这样的API解决方案不适用于：

google.maps.event.trigger(map, 'resize')

我还有一个主意，但是不知道它是否会起作用，我也不知道如何去做。 是否可以在显示器上放置某种延迟加载：无CSS，以便以全尺寸加载地图，并在1或2秒后将其隐藏？ 如果可以的话请帮忙

Answer 1

显示这种地图的最简单方法是，当您单击用于显示框架的元素时，调用javascrip函数以生成地图。

我经常不得不使用隐藏的地图，并且发现没有任何问题的最简单查看方法是调用连接到演示事件（例如按钮或标签）的地图显示功能

在HTML中

<div class = "myclass" onclick = "show_my_map()">

在JavaScript中

<script>

show_my_map function() {

   mapOptions var = {
     Level: 17,
     center: new google.maps.LatLng (41.650299490787712, 12.536399034779)
     mapTypeId: google.maps.MapTypeId.SATELLITE
   };



   map = new google.maps.Map (document.getElementById ('map-canvas'),
      mapOptions);

}
</script>