2012-05-17 9 views
27

このコードをquestionにコピーして、緯度と経度を適用しました。ただし、緯度と経度は動的になり、地図のcenterは場所の緯度と経度によって変わります。Googleマップで複数の場所の中心を見つける

次は私の質問は、動的な位置を有するとき、私は地図の中心を知ることができるか、である他の質問

<!DOCTYPE html> 
<html> 

    <head> 
     <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
     <title>Google Maps Multiple Markers</title> 
     <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script> 
    </head> 

    <body> 
     <div id="map" style="width: 500px; height: 400px;"></div> 
     <script type="text/javascript"> 
      var locations = [ 
       ['Bondi Beach', -33.890542, 151.274856, 4], 
       ['Coogee Beach', -33.923036, 151.259052, 5], 
       ['Cronulla Beach', -34.028249, 151.157507, 3], 
       ['Manly Beach', -33.80010128657071, 151.28747820854187, 2], 
       ['Maroubra Beach', -33.950198, 151.259302, 1] 
      ]; 

      var map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 10, 
       center: new google.maps.LatLng(-33.92, 151.25), 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }); 

      var infowindow = new google.maps.InfoWindow(); 

      var marker, i; 

      for (i = 0; i < locations.length; i++) { 
       marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
        map: map 
       }); 

       google.maps.event.addListener(marker, 'click', (function(marker, i) { 
        return function() { 
         infowindow.setContent(locations[i][0]); 
         infowindow.open(map, marker); 
        } 
       })(marker, i)); 
      } 
     </script> 
    </body> 

</html> 

からコードです。 centerを空白のままにしてみましたが、マップが読み込まれませんでした。

答えて

82

最初に、動的に生成されたすべての場所を含めることによってLatLngBoundsオブジェクトを作成できます。ポイントを含めるには、extendメソッドを使用します。次に、getCenterメソッドを使用して境界の中心を取得できます。

UPDATE:

コード:

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

for (i = 0; i < locations.length; i++) { 
    bound.extend(new google.maps.LatLng(locations[i][2], locations[i][3])); 

    // OTHER CODE 
} 

console.log(bound.getCenter()); 

イラスト:

enter image description here

+2

境界内地図ズーム中心UIに合わせてコードにmap.fitBounds(結合)を加えます。 –

0

私は緯度を平均化し、経度を平均化し、それらを使用してこれをやっています私の中心としての平均。

例:

self.adjustPosition = function() { 
    var lat = 0, lng = 0; 

    if (self.nearbyPlaces().length == 0) { 
     return false; 
    } 

    for (var i = 0; i < self.nearbyPlaces().length; i++) { 
     lat += self.nearbyPlaces()[i].latitude; 
     lng += self.nearbyPlaces()[i].longitude; 
    } 

    lat = lat/self.nearbyPlaces().length; 
    lng = lng/self.nearbyPlaces().length; 

    self.map.setCenter(new window.google.maps.LatLng(lat, lng)); 
}; 
0

それは数字の「真ん中」を取得数字を平均化していないので、このアプローチは動作しません(緯度/ロング)。このように考えると、米国では6ポイント、カリフォルニアでは1ポイント、東海岸では5ポイントが南北に広がっています。東海岸の5は、地図上の右(東)の平均値になり、あなたの中心点はジョージア周辺(東から西)になります。 getCenterの使用を避けたい場合は、東方向(lat +/-とlong +/-)の最高値と最低値を見つけて、極端な値を取ったら各方向の中央を探したいと思うでしょう。

0
private LatLng computeCentroid(List<LatLng> points) { 
double latitude = 0; 
double longitude = 0; 
int n = points.size(); 

for (LatLng point : points) { 
    latitude += point.latitude; 
    longitude += point.longitude; 
} 

return new LatLng(latitude/n, longitude/n); 

}

関連する問題