谷歌地图不会出现

Question

谷歌地图不会出现

我正在关注谷歌地图的入门教程,但出于某种原因,地图没有出现在我的网页上.相关的HTML/CSS/JS是:

<!DOCTYPE html>
<html>
<head>
    <meta name="layout" content="main"/>

    <script type="text/javascript"
        src="http://maps.googleapis.com/maps/api/js?sensor=false">
    </script>
    <script type="text/javascript">
      function initialize() {
        var latlng = new google.maps.LatLng(-34.397, 150.644);
        var myOptions = {
          zoom: 8,
          center: latlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),
            myOptions);
      }

    </script>
</head>

<body onload="initialize()">
  <div id="map_canvas" style="width: 400px; height: 400px"></div>
</body>

</html>

Run Code Online (Sandbox Code Playgroud)

地图不会出现在map_canvasdiv中.

更新

我已经更改了页面,因此它不使用JQuery加载地图.它现在使用与教程中完全相同的JS,但仍然没有出现地图.

Answer 1

Jir*_*riz 15

您的代码有3个问题:

(1)之前添加以下行 <script type="text/javascript">function initialize() {

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

Run Code Online (Sandbox Code Playgroud)

这是您的答案的帖子,但它不在您的文件http://www.iol.ie/~murtaghd/map/map.htm中.

(2)你需要打电话initalize()(再次:它在你的帖子中,但不在代码中):

<body onload="initialize();">

Run Code Online (Sandbox Code Playgroud)

(3)设置画布的大小以显示地图(再次:它在你的帖子中,但不在代码中).之后您可以根据需要更改大小.

<div id="map_canvas" style="width:500px; height:300px"></div>

Run Code Online (Sandbox Code Playgroud)

您可以在jsfiddle上看到该网站正在运行.

归档时间：	14 年，1 月前
查看次数：	21852 次
最近记录：	8 年，4 月前