如何获取html5地图区域的中心点？答案

【问题标题】：How to get center point of html5 map area?如何获取html5地图区域的中心点？
【发布时间】：2017-08-23 20:59:28
【问题描述】：

如何获取 HTML 5 地图区域的中心点？在这个web page http://webven.ru/portfolio/istra/page.html 上有多边形，有很多坐标。如何获得中心点？

我试过下面的代码：

function calculateCenterPoint(areas) {
var maxX = 0,
    minX = Infinity,
    maxY = 0,
    minY = Infinity;
Array.prototype.forEach.call(areas, function (e) {
    var i = 0,
        coords = e.getAttribute('coords').split(',');
    while (i < coords.length) {
    var x = parseInt(coords[i++],10),
        y = parseInt(coords[i++],10);
    if (x < minX) minX = x;
    else if (x > maxX) maxX = x;

    if (y < minY) minY = y;
    else if (y > maxY) maxY = y;
    }
});
return {
    x: minX + (maxX - minX) / 2,
    y: minY + (maxY - minY) / 2
};}

但它并不适用于所有区域。

【问题讨论】：

欢迎来到 SO，你能创建一个代码 sn-p 或小提琴吗？
我在你的页面上试过了，它返回{ x: 1304.5, y: 926.5 }，这对我来说是正确的。

标签： javascript html canvas svg

【解决方案1】：

删除else if (x > maxX)和else if (y > maxY)中的else。

问题在于，在循环的第一次迭代中，两个条件都可以（并且将会）为真。

【讨论】：