javascript - 在矩形、圆形和多边形内填充标记

Question

我的要求是在用户绘制的区域内填充标记，该区域可以是圆形、矩形、多边形。

这就是我目前正在尝试的:-

map.on('draw:created', function(e) {
    var type = e.layerType, layer = e.layer;
    var bounds =  layer.getBounds();
});

现在我使用这些 bounds(southWest, northEast) latlongs 来虚拟创建行列间距，然后相应地填充标记。

问题:-

• 上述方法适用于矩形，所有标记都填充在矩形内。
• 不适用于圆形和多边形。标记也填充在圆和多边形之外(附近)。我猜 getBounds() 方法是通过创建一个接触圆和多边形所 Angular 框来给出边界或计算面积。

关于如何严格在圆和多边形的内部或边界上填充标记有什么建议吗？

提前致谢。

Answer 1

按照@kmandov 的建议通过 PIP 解析多边形内的点，并通过以下过程解析圆:-

• 获取点的经纬度。
• 获取圆心的经纬度。
• 对上述两个经纬度中的任何一个运行 distanceTo() 方法，并将第二个经纬度作为参数传递。
• 检查距离是否大于圆的半径。
• 如果它大于半径，则该点在圆外，否则在圆内。

这是我使用的条件:

if (customMarker.getLatLng().distanceTo(myCircle.getLatLng()) <= myCircle.getRadius()) {
          console.log("Marker is inside circle");
}else{
         console.log("Marker is outside circle");
}