How to get the center of a polygon in google maps v3?
Algorithm:
Run through all the points in the polygon. For all the points find;
x1
, the lowestx
coordinatey1
, the lowesty
coordinatex2
, the highestx
coordinatey2
, the highesty
coordinate
You now have the bounding rectangle, and can work out the center using:
center.x = x1 + ((x2 - x1) / 2);
center.y = y1 + ((y2 - y1) / 2);
Matthew's answer is a good solution. However, when using the Google Maps API v3, you might want to pass each point of the polygon to a LatLngBounds
object through the extend()
method, and then finally call the getCenter()
method on the LatLngBounds
object. Consider the following example:
var bounds = new google.maps.LatLngBounds();
var i;
// The Bermuda Triangle
var polygonCoords = [
new google.maps.LatLng(25.774252, -80.190262),
new google.maps.LatLng(18.466465, -66.118292),
new google.maps.LatLng(32.321384, -64.757370),
new google.maps.LatLng(25.774252, -80.190262)
];
for (i = 0; i < polygonCoords.length; i++) {
bounds.extend(polygonCoords[i]);
}
// The Center of the Bermuda Triangle - (25.3939245, -72.473816)
console.log(bounds.getCenter());
Here is a custom function I wrote. Feel free to use it.
function polygonCenter(poly) {
const vertices = poly.getPath();
// put all latitudes and longitudes in arrays
const longitudes = new Array(vertices.length).map((_, i) => vertices.getAt(i).lng());
const latitudes = new Array(vertices.length).map((_, i) => vertices.getAt(i).lat());
// sort the arrays low to high
latitudes.sort();
longitudes.sort();
// get the min and max of each
const lowX = latitudes[0];
const highX = latitudes[latitudes.length - 1];
const lowy = longitudes[0];
const highy = longitudes[latitudes.length - 1];
// center of the polygon is the starting point plus the midpoint
const centerX = lowX + ((highX - lowX) / 2);
const centerY = lowy + ((highy - lowy) / 2);
return (new google.maps.LatLng(centerX, centerY));
}
you can extend the Polygon class with your own version of the missing function, let's call it my_getBounds() :
google.maps.Polygon.prototype.my_getBounds=function(){
var bounds = new google.maps.LatLngBounds()
this.getPath().forEach(function(element,index){bounds.extend(element)})
return bounds
}
and than use it in code like this :
myPolygon.my_getBounds().getCenter()
... etc, it should be equivalent to the v2 behavior