Google Maps Places API地图未显示

时间:2012-09-07 15:12:04

标签: javascript google-maps-api-3 google-places-api

我刚开始使用google maps places API并且能够将这些代码汇总在一起,但地图却没有显示出来。我会想象这是一个小错误,但我找不到它。如果有人可以指出这将是一个巨大的帮助,也有任何在线或任何有利于捕获这样的错误的免费IDE吗?

代码:http://jsbin.com/ifuwel/1/edit

2 个答案:

答案 0 :(得分:2)

您有2个不同的ID(“map”和“map_canvas”)。试试这个:

map = new google.maps.Map(document.getElementById('map_canvas'), {
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    center: pyrmont,
    zoom: 15
});

答案 1 :(得分:-2)

试试这个基本的例子

HTML

 <body onload="initialize()">
   <div id="map_canvas"></div>
 </body>

的Javascript

    <script>
  function initialize() {
    var mapOptions = {
      zoom: 4,
      center: new google.maps.LatLng(-33, 151),
      panControl: false,
      zoomControl: false,
      scaleControl: true,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(document.getElementById('map_canvas'),
                                  mapOptions);
  }
</script>

CSS

    <style>
     html, body {
     height: 100%;
     margin: 0;
     padding: 0;
      }

     #map_canvas {
     height: 100%;
     }

     @media print {
     html, body {
     height: auto;
     }

     #map_canvas {
     height: 650px;
     }
      }
    </style>

如果需要,CSS有助于获得100%的宽度和高度