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

Question

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

Map Screenshot

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

        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.'");
        }
        ';

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

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

感谢帮助

Answer 1

您可以创建自己的contains 方法并将其添加到L.Circle 类，因为默认情况下它没有。您可以使用 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