获取多边形的边界框

Question

我有许多复杂的多边形，有些有750+点。 是否有快速有效的方法来获得边界框？ 我不想在每个点上循环并扩展边界框。

解决方案应该是javascript或者可能是我错过的Google Maps API v3功能。

---

或者我应该硬编码边界框的坐标并使用这些来减少客户端的负载？

如何制作多边形：

//Coordinates
var coordinates = [ 
    new google.maps.LatLng(11,22),
    new google.maps.LatLng(11,22),
    new google.maps.LatLng(11,22),

    //etc up to 200, 500 or even 800 points
]

//Options
var options = {
    path: coordinates,
    strokeColor: "#222",
    strokeOpacity: 1,
    strokeWeight: 2,
    fillColor: "#000",
    fillOpacity: 0,
    zIndex: 0
}

//Create polygon
var polygon = new google.maps.Polygon( options );

//Show it on map
polygon.setMap( map );

我需要做我的作业，因为实时计算被排除在外。 我可能需要以艰难的方式去做，但也许你们中的一些人知道一些方便的在线工具，根据插入的坐标计算边界框？

我需要尽可能简单的形状，因为我需要检查我的多边形是否在视口中，它可能是一个800点的噩梦，因为除了循环所有点之外我不知道任何其他方式。

Answer 1

Polygon在Google Maps API v3上没有方法getBounds 。 您可以手动实现它。 但它包含了fors。 顺便说说。 我已经实现了getBounds方法。 这是一个硬编码版本。 演示链接。

UPDATE

要获得多个多边形的单边框，请使用getBounds方法的union方法。

var coordinates = [ 
   new google.maps.LatLng(10,15),
   new google.maps.LatLng(12,16),
   new google.maps.LatLng(11,18),
   new google.maps.LatLng(11,19),
   new google.maps.LatLng(13,21),
   new google.maps.LatLng(12,22),
   new google.maps.LatLng(13,24),
   new google.maps.LatLng(11,25),
   new google.maps.LatLng(8,23),
   new google.maps.LatLng(7,23),
   new google.maps.LatLng(8,21),
   new google.maps.LatLng(6,17),
   new google.maps.LatLng(9,16)
]

var coordinates_1 = [ 
   new google.maps.LatLng(15,28),
   new google.maps.LatLng(16,30),
   new google.maps.LatLng(17,30),
   new google.maps.LatLng(16,31),
   new google.maps.LatLng(16,32),
   new google.maps.LatLng(14,29),
]

var options = {
   path: coordinates,
   strokeColor: "#222",
   strokeOpacity: 1,
   strokeWeight: 2,
   fillColor: "#000",
   fillOpacity: 0,
   zIndex: 0,
   map: map
}

var options_1 = {
   path: coordinates_1,
   strokeColor: "#222",
   strokeOpacity: 1,
   strokeWeight: 2,
   fillColor: "#000",
   fillOpacity: 0,
   zIndex: 0
}

var polygon = new google.maps.Polygon(options);
var polygon_1 = new google.maps.Polygon(options_1);

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

var rectangle = new google.maps.Rectangle({
    strokeColor: '#FF0000',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#FF0000',
    fillOpacity: 0.35,
    map: map,
    bounds: polygon.getBounds()
  });

var rectangle_1 = new google.maps.Rectangle({
    strokeColor: '#FF0000',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#FF0000',
    fillOpacity: 0.35,
    map: map,
    bounds: polygon_1.getBounds()
  });

var rectangle_single = new google.maps.Rectangle({
    strokeColor: '#FFC000',
    strokeOpacity: 0.8,
    strokeWeight: 2,
    fillColor: '#FFF000',
    fillOpacity: 0.35,
    map: map,
    bounds: polygon.getBounds().union(polygon_1.getBounds())
  });

Answer 2

一个更简单，更紧凑的代码版本是：

    google.maps.Polygon.prototype.getBounds = function() {
        var bounds = new google.maps.LatLngBounds();
        this.getPath().forEach(function(element,index){ bounds.extend(element); });
        return bounds;
    }

Answer 3

数组中的X和Y坐标，然后是x和y数组min和max。 虽然我们需要更多的图片才能知道你究竟想要什么以及如何。

Answer 4

如果给出的点我们没有先验结构，那么没有比迭代点和扩展边界框更有效的方法 。 由于您事先不知道任何事情，因此任何点都可以是角点 （或边缘点 ），因此您必须将其考虑在内。 没有算法可以更有效地做到这一点。

但是，如果您可以控制提供坐标的服务器，则可以将这些点预先存储在像kd树这样的数据结构中 。 比如说所有的点都是静态的，你可以将它们存储在这样的kd树中，然后你就可以快速加速了事情（虽然据我所知，问题仍然是O（n） ，但你不必采取所有要点都考虑在内）。

但问题是您没有提供有关服务器端的任何信息。