Question

我在我的网页上嵌入了谷歌地图。在IE8中，部分地图渲染但地图的其余部分为灰色。在Firefox中，整个地图都是灰色的。我的代码是这样的：

<script type="text/javascript">

             function initialize() {
                 if (GBrowserIsCompatible()) {
                     var map = new GMap2(document.getElementById("map_canvas"));
                     map.setCenter(new GLatLng(37.4419, -122.1419), 13);
                     map.setUIToDefault();
                 }
             }

             window.setTimeout(function() {
                 initialize();
             }, 750);

             window.onunload = GUnload;
</script>

<div id='map_canvas' style="float:left; width:481px; height:450px; border-style:solid; border-width:2px; border-left:none; border-color:#5793C9">

我复制的谷歌示例代码使用<body onload>并卸载，但由于我的正文在母版页中定义，因此我无法访问这些代码。我猜这可能就是原因。我该如何解决？

编辑添加：我的test.html正在做同样的事情。 test.html的全部内容是：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps JavaScript API Example: Simple Map</title>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=KEYABCDE"
            type="text/javascript"></script>
    <script type="text/javascript">

    function initialize() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(37.4419, -122.1419), 13);
        map.setUIToDefault();
      }
    }

    </script>
  </head>
  <body onload="initialize()" onunload="GUnload()">
    <div id="map_canvas" style="width: 500px; height: 300px"></div>
  </body>
</html>

Answer 1

750毫秒可能不足以使DOM完全加载。

而不是：

window.setTimeout(function() {
  initialize();
}, 750);

尝试使用：

window.onload = initialize;

Answer 2

确保您的默认值合理。您是否将地图置于现有点的中心？看起来你是......你给它可接受的缩放级别？缩放级别是否存在？

Answer 3

如果您在Firefox上遇到此问题，可以为地图容器设置img CSS（级联样式表），如下所示：

.gmap img {
  max-width: none;
}

显然是FF上的“无证件”

我在这里发现了这篇文章： https://drupal.org/node/1298800

我没有使用Drupal，但它修复了我在Firefox上的问题..

此致金

嵌入式谷歌地图只是灰色

3 个答案: