如何让Google Maps显示整个多边形？
我有一组GPolygon对象，它们被附加到我的域模型中的对象，并被添加到我页面上的映射中。域对象显示在同一页面上的列表中，当用户单击其中一个时，我希望显示关联的多边形。
我希望显示整个多边形，理想情况下，我希望地图以多边形中心为中心。
我希望会有一个地图API调用，类似于...
myMap.makeSureYouCanSeeAllThisPolygon(aPolygon);但我一直没能找到一个。
如果我必须手动操作，那么我显然可以很容易地计算出居中，但是我如何计算缩放呢？
回答 6
Stack Overflow用户
发布于 2010-02-01 22:34:39
您可以使用aPolygon.getBounds().getCenter();，然后使用myMap.setCenter()方法返回的GLatLng来获取多边形的中心点。
要获得缩放级别，您可以使用myMap.getBoundsZoomLevel(aPolygon.getBounds());，然后将其与myMap.setZoom()方法一起使用。
Stack Overflow用户
发布于 2011-06-14 13:17:31
Google Maps v3 API本身并不支持google.maps.Polygon类的getBounds()方法。考虑到google.maps.Map类有一个fitBounds()方法，这似乎很奇怪，这正是您要寻找的方法。如果您以任何一种频率使用Google Maps API，那么您应该掌握以下技巧：
google.maps.Polygon类的getBounds()方法
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;
}手头有这个方法使得在地图上居中和拟合多边形变得非常简单。
注意:如果您不熟悉getAt()和getLength()，也可以，它们是google.maps.MVCArray类独有的方法。当您调用多边形的getPaths()方法时，它将LatLng数组作为LatLng的可变MVCArray返回。你可以在这里准备好MVCArrays - 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 James
Stack Overflow用户
发布于 2016-01-14 22:38:39
我写了一个函数来添加到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;
}https://stackoverflow.com/questions/2177055
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号