使用Google Maps API显示标记

Question

使用Google Maps API显示标记

use*_*417 1 javascript api google-maps google-maps-api-3

我正在尝试设置一个简单的页面,使用Google Maps API在某个位置显示标记.不过我不是这个代码,这是基于谷歌的示例代码获取标记在这里.我改变了来源

"https://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=false"

Run Code Online (Sandbox Code Playgroud)

至

"http://maps.google.com/maps/api/js?sensor=false"

Run Code Online (Sandbox Code Playgroud)

因为这里建议避免使用API密钥.var标记声明是从谷歌这里复制的.我的标记出现什么必须改变？

<!DOCTYPE html>
<html>
  <head>
    <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="http://maps.google.com/maps/api/js?sensor=false"></script>
    </script>
    <script type="text/javascript">
      function initialize() {

        var location = new google.maps.LatLng(59.272, 10.418);  

        var mapOptions = {
          center: location,
          zoom: 8
        };

        var marker = new google.maps.Marker({
            position: location,
            map: map,
            title: 'Hello World!'
        });

        var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);
      }
      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map-canvas"/>
  </body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

And*_*ndy 5

在设置标记的行之前移动设置地图的线,因为标记在其调用中使用地图:

function initialize() {
  var location = new google.maps.LatLng(59.272, 10.418);

  var mapOptions = {
    center: location,
    zoom: 8
  };

  var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

  var marker = new google.maps.Marker({
    position: location,
    map: map,
    title: 'Hello World!'
  });
}

Run Code Online (Sandbox Code Playgroud)

归档时间：	11 年，10 月前
查看次数：	2265 次
最近记录：	10 年，2 月前