javascript - 如何检测一个元素位于另一个元素之上

Question

我有这种情况:

当元素坐在另一个元素之上时，我需要检测情况。这是 SVG 元素:

<circle r="210.56" fill="#1ABCDB" id="01" priority="4" cx="658" cy="386"></circle>
<circle r="210.56" fill="#1ADC4A" id="02" priority="4" cx="858" cy="386"></circle>

我必须知道如何做到这一点，也许有人可以给我一些提示。我使用 jQuery。非常感谢您的帮助。

Answer 1

好吧，至少如果你处理的是圆，这有点简单，因为圆有一个很好的属性:对于以任何方式重叠的圆，它们的半径之和应该大于它们之间的距离他们的两个中心。

所以这应该只是一个问题:

1. 计算出两个中心点之间的距离(很容易得到中心点，因为它们在 <circle> 元素中定义，并且
2. 添加两个半径值(同样在 <circle> 元素上)，然后
3. 只是比较。如果半径和大于距离，则重叠。

http://jsfiddle.net/sZ9N9/