边界无效,在尝试添加边界时甚至不显示标记

时间:2013-02-07 05:14:47

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

下面的当前代码甚至没有显示标记,但是当删除边界时,标记开始出现。我不知道我哪里错了。我想做的就是缩放地图以包含所有3个标记。目前它正在缩放到0,0。 我确实提供了我的api密钥,所以这不是问题。

代码:

<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="https://maps.googleapis.com/maps/api/js?key=<key provided>&sensor=true">
    </script>

    <script type="text/javascript">
      function initialize() {
var markers = [
{ lat: 61.912113, lng: 61.912113 },{ lat: 62.912149, lng: 62.912144 },{ lat: 61.411123, lng: 61.411123 }];

        var mapOptions = {
center: new google.maps.LatLng(0,0),
          zoom: 8,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);

var bounds = new google.maps.LatLngBounds ();
var LatLngList = array (new google.maps.LatLng (markers[0].lat,markers[0].lng), new google.maps.LatLng (markers[1].lat,markers[1].lng), new google.maps.LatLng (markers[2].lat,markers[2].lng));
for (i = 0; i < markers.length; i++) {
var data = markers[i];

var myLatlng = new google.maps.LatLng(data.lat, data.lng);
var marker = new google.maps.Marker({
      position: myLatlng,
      map: map,
      title: "text"
  });
}
for (var i = 0; i < LatLngList.length; i++) {
  bounds.extend (LatLngList[i]);
}
map.fitBounds (bounds);
      }
    </script>
  </head>
  <body onload="initialize()">
    <div id="map_canvas" style="width:100%; height:100%"></div>
  </body>
</html>

1 个答案:

答案 0 :(得分:1)

在此行上创建数组时出错(我为了便于阅读而截断了代码):

var LatLngList = array (new google.maps.LatLng (markers[0].lat,markers[0].lng) );

将其更改为:

var LatLngList = Array (new google.maps.LatLng (markers[0].lat,markers[0].lng) );

var LatLngList = [ new google.maps.LatLng (markers[0].lat,markers[0].lng) ];