0

我尝试将以下来自 google 的示例代码添加到我的 zf 应用程序中。
在头部:

<style type="text/css">
  html, body, #map_canvas {
    margin: 0;
    padding: 0;
    height: 100%;
  }
</style>
<script type="text/javascript"
    src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  var map;
  function initialize() {
    var myOptions = {
      zoom: 8,
      center: new google.maps.LatLng(-34.397, 150.644),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById('map_canvas'),
        myOptions);
  }

  google.maps.event.addDomListener(window, 'load', initialize);
</script>

在我看来:

  <div id="map_canvas"></div>

我正在使用布局脚本,如果我禁用它,地图就会显示,但如果我使用我的布局,它就会消失。谁能告诉我发生了什么?

4

1 回答 1

0

好的,我已经想通了。这确实是一个 CSS 问题。我的页面内容周围有一个容器 div。它的最小高度设置为 600 像素。谷歌示例中的 CSS 将 html 和 body 设置为 100% 高度。我将容器高度更改为 100% 并解决了它。

于 2012-05-18T18:00:54.367 回答