Google Maps api v3的fitbounds不在我的折線中心

Question

我希望能夠集中縮放我網站上的所有折線。

另外，我想向每個新的坐標對添加標記。 我已經看到了很多關於多個標記和多個多邊形的示例，但是對於折線卻從未見過，我無法解決這個問題...

我看到了一些非常有用的頁面，例如： http : //salman-w.blogspot.com/2009/03/zoom-to-fit-all-markers-polylines-or.html

但是他們大多數人事先都具備某種知識，而我所了解的並不多。

這是我的代碼：

<script type="text/javascript">

  function initialize() {
  var myLatLng = new google.maps.LatLng(45.397, 5.644);
  var centerLatLng = new google.maps.LatLng(35.71,-1.905);

  var myOptions = {
    zoom: 5,
    center: centerLatLng,
    scrollwheel: false,
    mapTypeControl: false,
    mapTypeId: google.maps.MapTypeId.SATELLITE
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"),
      myOptions);

  var flightPlanCoordinates = [
    new google.maps.LatLng(45.397, 5.644),
    new google.maps.LatLng(28.713383,-17.905781),
    new google.maps.LatLng(20.713383,-19.905781),
    new google.maps.LatLng(25.713383,-29.905781),

  ];

  var flightPath = new google.maps.Polyline({
    path: flightPlanCoordinates,
    strokeColor: "#dddd00",
    strokeOpacity: 1.0,
    strokeWeight: 3
  });

  flightPath.setMap(map);

}
</script>

在此先感謝您，我對Google API和該網站還是陌生的。

Answer 1

嘗試將點的位置添加到bounds對象中，然后使用fitBounds，如下所示：

var bounds = new google.maps.LatLngBounds();

var point1 = new google.maps.LatLng(45.397, 5.644);
bounds.extend(point1);
var point2 = new google.maps.LatLng(28.713383,-17.905781);
bounds.extend(point2);
var point3 = new google.maps.LatLng(20.713383,-19.905781);
bounds.extend(point3);
var point4 = new google.maps.LatLng(25.713383,-29.905781);
bounds.extend(point4);

map.fitBounds(bounds);