将多个标记居中Google API v3

Center multiple markers Google API v3

本文关键字:Google API v3      更新时间:2023-09-26

我意识到有一些例子,但我无法使它与我的脚本一起工作。我知道你需要有一个界限,但它不起作用。

这是我的代码:

<script type="text/javascript">
  var infowindow;
  var map;
  function initialize() {
    var myLatlng = new google.maps.LatLng(37.4419, -122.1419);
    var myOptions = {
      zoom: 13,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    downloadUrl("include/moredata.xml", function(data) {
      var markers = data.documentElement.getElementsByTagName("marker");
      for (var i = 0; i < markers.length; i++) {
        var latlng = new google.maps.LatLng(parseFloat(markers[i].getAttribute("lat")),
                                    parseFloat(markers[i].getAttribute("lng")));
        var marker = createMarker(markers[i].getAttribute("name"), latlng);
       }
     });
  }
  function createMarker(name, latlng) {
    var marker = new google.maps.Marker({position: latlng, map: map});
    google.maps.event.addListener(marker, "click", function() {
      if (infowindow) infowindow.close();
      infowindow = new google.maps.InfoWindow({content: name});
      infowindow.open(map, marker);
    });
    return marker;
  }
  function AutoCenter() {
    //  Create a new viewpoint bound
    var bounds = new google.maps.LatLngBounds();
    //  Go through each...
    $.each(markers, function (index, marker) {
    bounds.extend(marker.position);
    });
    //  Fit these bounds to the map
    map.fitBounds(bounds);
    }
</script>

起初我以为这是因为我宣布了一个中心并放大了我的选项,但即使去掉了这些选项,我的地图也没有显示出来。请帮忙???非常感谢。

首先设置一个数组:

var realMarkers = [];

然后将标记推入阵列:

var marker = createMarker(markers[i].getAttribute("name"), latlng);
realMarkers.push(marker);

然后当你循环realMarker:

bounds.extend(marker.getPosition());