无法使用 .getBounds() 函数（Leaflet）仅显示特定范围（圆圈）内的点

Question

我正在尝试显示特定范围内的一定数量的点，即在圆内。但是当使用 .getBounds() 函数进行比较以查看该点是否在边界内时，我得到了它之外的一些点，如下面的屏幕截图所示：

当前用于检查点是否在圆边界内的代码如下：

        echo '
        var mark = L.marker([' . $r->coordinates[0]->longitude . ',' . $r->coordinates[0]->latitude . ']);

        if(circle.getBounds().contains(mark.getLatLng())){
            mark.addTo(map);
            mark.bindPopup("'.$info.'");
        }
        ';

我循环到一个数组中以检索纬度和经度，然后从那里查看坐标是否填充到边界中，如果是，它会将其添加到地图及其相应的弹出窗口中

关于这个特定问题的任何解决方案？

感谢您的帮助

Answer 1

方法getBounds()总是returns一个矩形区域。因此它不能用于检查非矩形对象是否包含给定点。

对于圆，您应该能够计算点到圆心 (getLatLng()) 的距离 (distanceTo())，并检查它是否小于圆的半径 (getRadius()).请注意，距离和半径以米为单位。

Answer 2

您可以创建自己的 contains 方法并将其添加到 L.Circle class 中，因为默认情况下它没有。您可以使用 L.LatLng 对象的实用方法 distanceTo 来计算标记与圆心之间的距离，并将其与圆的半径进行比较：

L.Circle.include({
    contains: function (latLng) {
        return this.getLatLng().distanceTo(latLng) < this.getRadius();
    }
});

现在，当您有一个圆圈和一个标记或经纬度对象时，您可以这样做：

var map = L.map(...);

var circle = L.circle(...).addTo(map),
    marker = L.marker(...).addTo(map);
    latLng = L.latLng(...);

// Returns true when in the circle and false when outside
circle.contains(marker.getLatLng());
circle.contains(latLng);

Plunker 上的工作示例：http://plnkr.co/edit/OPF7DM?p=preview

L.Circle参考：http://leafletjs.com/reference.html#circle

L.Marker参考：http://leafletjs.com/reference.html#marker

L.LatLng参考：http://leafletjs.com/reference.html#latlng

无法使用 .getBounds() 函数（Leaflet）仅显示特定范围（圆圈）内的点

Unable to display only the points within a specific range (circle) using the .getBounds() function (Leaflet)

mongodb

leaflet

openstreetmap

geometry

point