【问题标题】:finding polygon center google map api 3寻找多边形中心谷歌地图api 3
【发布时间】:2018-10-17 08:04:10
【问题描述】:

我想在谷歌地图中找到多边形的中心,我尝试了几种解决方案,但是对于直角三角形多边形,它们都不能正常工作,下面是示例代码:

var path = new Array(new google.maps.LatLng(1, 1), new google.maps.LatLng(1, 10), new google.maps.LatLng(10, 10), new google.maps.LatLng(1, 1));

var mapOptions = {
    zoom: 4,
    center: new google.maps.LatLng(40, 9),
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

var polygon = new google.maps.Polygon({
    path: path,
    map: map
});

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

for (var i=0; i<polygon.getPath().length; i++) {

    var point = new google.maps.LatLng(path[i].lat(), path[i].lng());
    bounds.extend(point);
}

map.fitBounds(bounds);
    const marker = new google.maps.Marker({
  position: {
    lat: bounds.getCenter().lat(),
    lng: bounds.getCenter().lng()
  },
  map: this.map,
  title: "Hello World!"
});
marker.setMap(map);

我使用google.maps.LatLngBounds(); 来查找三角形的中心并在地图中标记中心,但结果中心实际上并不是三角形的真正中心,jsfiddle example of this code
我使用了另一种解决方案which is discussed here 来查找多边形的中心,但这也不起作用,那么无论多边形类型如何,还有其他解决方案可以找到准确的多边形中心吗?

【问题讨论】:

  • “真正的”中心是什么意思?
  • 如果您看到 jsfiddle 示例,您可以看到标记并不完全位于三角形的中心。我的意思是 bounds.center() 不是三角形的中心点
  • 所以你想要centroid of the polygon,而不是边界的中心。

标签: google-maps google-maps-api-3 polygon


【解决方案1】:

points是多边形点的数组,调用getCenter获取中心坐标。

var points = [[1,1],[1,10],[10,10]];
function getCenter(){
    var sumX = 0, sumY = 0;
    for(var i = 0; i < points.length; i++){
        var point = points[i];
        var x = point[0];
        var y = point[1];
        sumX += x;
        sumY += y;
    }
    return {x:sumX / points.length,y:sumY / points.length};
}

var centerOfPoints = getCenter();

【讨论】:

    猜你喜欢
    • 2011-11-21
    • 2013-02-03
    • 1970-01-01
    • 2012-07-01
    • 2016-11-22
    • 2011-09-13
    • 1970-01-01
    • 2014-12-07
    相关资源
    最近更新 更多