Google Maps API V3标记未加载

时间:2013-04-13 22:29:54

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

我正在尝试在谷歌地图上显示我正在做的网站的标记。没有标记代码,地图加载正常并显示正确的位置(没有标记),当我添加标记代码时,地图不再加载。很明显,我错过了一些简单的东西,但我对Jquery不太熟悉。

    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0; padding: 0 }
  #map-canvas { height: 100% }
</style>
<script type="text/javascript"
  src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBWJYTBt3bKUIsQKKsQPSnR1IHNdkAmBQs&sensor=false">
</script>
<script type="text/javascript">
  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(53.154662, -1.208357),
      zoom: 15,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);
  }
var marker = new google.maps.Marker({
  position:(53.154662, -1.208357),
  map: map-canvas,
  title:"Hello World!"
});
  google.maps.event.addDomListener(window, 'load', initialize);

</script>

感谢您的帮助。

1 个答案:

答案 0 :(得分:1)

map - 属性应为google.maps.Map - 实例,且position-property必须为google.maps.LatLng

此外,您必须在创建地图时以及可以访问地图实例的范围内创建标记,例如在initialize()的末尾。

function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(53.154662, -1.208357),
      zoom: 15,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById("map-canvas"),
        mapOptions);

    var marker = new google.maps.Marker({
      position:new google.maps.LatLng(53.154662, -1.208357),
      map: map,
      title:"Hello World!"
    });
  }