如何讓Google地圖顯示整個多邊形？

我有一組GPolygon對象附加到我的域模型中的對象，並添加到我的頁面上的地圖。域對象顯示在同一頁面的列表中，當用戶點擊其中一個時，我想顯示相關的多邊形。如何讓Google地圖顯示整個多邊形？

我想要顯示整個多邊形，並且理想情況下我希望地圖以多邊形中心爲中心。

我希望會有沿的線條地圖API調用...

myMap.makeSureYouCanSeeAllThisPolygon(aPolygon);

，但我一直沒能找到一個。

如果我必須手動執行此操作，那麼很明顯我很容易找出對中情況，但是如何確定變焦？

來源

2010-02-01 Simon

通過使用aPolygon.getBounds().getCenter();，然後使用myMap.setCenter()方法返回的GLatLng，您可以獲得多邊形的中心點。

要獲得縮放級別，您可以使用myMap.getBoundsZoomLevel(aPolygon.getBounds());，然後使用此方法與myMap.setZoom()方法。

來源

2010-02-01 14:34:38

這不再是事實！ Maps v3拋棄了getBounds（）方法。 – Benjamin 2014-09-10 18:59:16

檢查此鏈接以擴展多邊形以獲取邊界（Google地圖V3），http://tutorialspots.com/google-maps-javascript-api-v3-method-polygon-getbounds-515.html – shyammtp 2015-03-05 12:30:51

Google Maps v3 API本身不支持google.maps.Polygon類的getBounds()方法。這看起來很奇怪，因爲google.maps.Map類有一個fitBounds()方法，這正是您要查找的內容。如果您以任何頻率使用Google Maps API，那麼這應該在招數::

爲google.maps.Polygon類

google.maps.Polygon.prototype.getBounds = function() { 
    var bounds = new google.maps.LatLngBounds(); 
    var paths = this.getPaths(); 
    var path;   
    for (var i = 0; i < paths.getLength(); i++) { 
     path = paths.getAt(i); 
     for (var ii = 0; ii < path.getLength(); ii++) { 
      bounds.extend(path.getAt(ii)); 
     } 
    } 
    return bounds; 
}

具備此方法

getBounds()方法使得它非常簡單，中心和地圖上安裝一個多邊形。

注意：如果您不熟悉getAt()和getLength()那很好，它們是google.maps.MVCArray類獨有的方法。當您調用多邊形的getPaths()方法時，它會將LatLng的數組作爲LatLng的可變MVCArray返回..您可以在此準備好有關MVCArray的信息 - Google Maps v3 API MVCArray class。

繼續前進。這裏是框架，你必須在下一個代碼之前在某個地方實現原型方法。

var map = new google.maps.Map(container, opts); // I'll spare the details on this 

var coords = [ 
    new google.maps.LatLng(25.774252, -80.190262) 
    ,new google.maps.LatLng(18.466465, -66.118292) 
    ,new google.maps.LatLng(32.321384, -64.75737) 
    ,new google.maps.LatLng(25.774252, -80.190262) 
]; 

var myPolygon = new google.maps.Polygon({ 
    paths: coords 
    ,strokeColor: "#A80000" 
    ,strokeOpacity: 0.8 
    ,strokeWeight: 1 
    ,fillColor: "#0b2a32" 
    ,fillOpacity: 0.12 
});

隨着舞臺佈景，所有你需要做的居中並放大這個（或有）多邊形::

map.fitBounds(myPolygon.getBounds());

簡短而親切。希望有所幫助。

-Kevin詹姆斯

來源

2011-06-14 05:17:30

這不適用於我。控制檯說「p」沒有定義。我注意到谷歌隨機更改它的變量名稱，這可能是發生了什麼？ – Derek 2011-12-21 21:01:14

@Derek'path = paths.getAt（p）;'應該是'path = paths.getAt（i）;'。 – Shef 2012-01-26 13:32:05

這真的很好。我建議你在getBounds（）polyfill周圍添加一個條件，以防谷歌選擇在未來本地添加。像這樣：if（！google.maps.Polygon.prototype.getBounds） – 2013-12-06 06:24:00

該解決方案爲我已經成功添加到地圖的多邊形。爲google.maps.Polygon類添加getBounds（）方法，然後使用map.fitBounds（myPolygon.getBounds（））;

來源

2012-07-19 22:25:23 infojdem

認爲他彪：

map.fitBounds(myPolygon.my_getBounds());

工作的享受。

來源

2013-12-15 14:29:03 user1416526

這適用於我以及使用GMaps。 – stealthysnacks 2016-10-05 19:09:29

我寫了一個函數添加到Kevin James解決方案。它需要一個多邊形數組並獲取您在地圖上可能具有的所有多邊形的邊界。你只需要將它們推到一個數組上，然後你可以調用我的函數來自動縮放地圖。

function getArrayBounds(polyArray){ 
    var bounds = new google.maps.LatLngBounds(); 
    var path, paths; 
    for(var polys = 0; polys < polyArray.length; polys++) { 
     paths = polyArray[polys].getPaths();  
     for (var i = 0; i < paths.getLength(); i++) { 
      path = paths.getAt(i); 
      for (var ii = 0; ii < path.getLength(); ii++) { 
       bounds.extend(path.getAt(ii)); 
      } 
     } 
    } 
    return bounds; 
}

來源

2016-01-14 14:38:38 Doug

如何讓Google地圖顯示整個多邊形？

回答

相關問題