Javascript 通过在SVG元素周围绘制手绘来选择SVG元素

我正在做一个项目，我想在一些SVG元素周围画一条线，以便选择区域内的对象

这是我现在的截图。我已经用油漆添加线，以使它完全清楚我试图实现什么。我想在绘制的圆内选择两个

rect

我看到了一些必须解决的步骤：

在

mousedown

处创建

path

元素，并记录鼠标移动直到

mouseup

关闭

路径

，以防用户没有画圆

查找完全或部分位于圆圈内的svg元素

你看到了哪些方法，你对如何进行有什么建议吗

---

我正在使用。这篇文章（由D3的创建者迈克·博斯托克（Mike Bostock）撰写）也许值得一看

获取写意形式的aabb（或最小/最大框）

查找aabb与自由形式重叠的所有元素，并将其保存在列表中

得到徒手形式的凸壳

测试列表元素中的每个或某些顶点是否位于凸包内

根据是否测试所有顶点位于凸面外壳内，可以确定元素是否完全位于徒手绘制图形内，还是仅与之重叠

不幸的是，我对d3.js不太熟悉，但我猜它提供了一些方法来获得多边形内部的凸包、aabbs和测试点。也许它甚至可以让您在步骤2中进行aabb查询以查找重叠的aabb

---

祝你好运……

是的，这样的办法应该行得通。您可能会发现这里的答案非常有用：+1，它向我介绍了凸包的概念。提示2小时与工作无关的维基百科拖网…谢谢@philipp。我不熟悉aabb的概念，因此我将对此进行研究。这听起来是个好办法。