无法通过嵌套div显示谷歌地图

时间:2015-01-21 19:28:05

标签: javascript html css google-maps

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=myApikey">
<script type="text/javascript">
function initialize() {
  // Create the map.
  var mapOptions = {
    center: new google.maps.LatLng(40.7051364, -74.3531065),
    zoom: 10
  };

  var map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
  }
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<style type="text/css">
body {
    background-color: #fff;
    color: #2a2a2a;
    margin: 0px;
    padding: 0px;
    font-family: CMArial;
}
.Container {
    width: 960px;
    height: 1235px;
    background-color: #fff;
    z-index: 0;
}
.Content {
    width: 960px;
    height: 850px;
    position: relative;
    text-align: left;
    left: 25px;
    top: 130px;
    z-index: 99;
}
</style>
<body>
<center>
<div class="Container">
<div class="Content">
    <div id="map" style="width:400px;height:400px;">
        <div id="map-canvas" style="width:100%;height:100%;"></div>
    </div>
</div>
</div>

无法获取地图以显示在div中,我想保留两个div是他们是我的页面布局的一部分。我可以做或不做的“地图”div,我只是想找到一种方法在我的页面上有一个给定的高度和宽度的地图。到目前为止,我没有尝试过任何工作。我的页面上有更多代码,但这是所有相关代码。任何帮助将非常感激。从这里开始,我将尝试在地图上为三个县获取多边形,但首先我必须要显示地图。我已经有了县的多边形数据。

1 个答案:

答案 0 :(得分:0)

用实际脚本更新,我错过了结束样式标记,这是一个拼写错误的格式化这个问题,但它确实指出这一行,当我修复解决了我的问题:

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=myApikey">

关闭它读取:

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=myApikey"></script>

谢谢大家帮忙指出那些东西。