Javascript 鼠标覆盖隐藏堆叠元素以防鼠标移动（HIT测试）

我在计算D3是否可能实现这一点上有点困难，更不用说如何实现了

我有一个rect元素，我已经附加了3个事件处理程序（“click”、“Mouseover”、“mouseout”）。这一切都很好。唯一的问题是我还向相同的

添加了一个文本元素，该元素位于rect元素的顶部。像这样：

<g>
    <rect x="204" y="204" width="204" height="204" style="fill: yellow; pointer-events: all; fill-opacity: 0.402592;" stroke="none" stroke-width="0" stroke-dasharray="15,15,15">
    <text class="word" x="306" y="306" text-anchor="middle" fill="black" style="fill-opacity: 1.00648;">Text Element</text>
</g>

文本元素

我看到的问题是，mouseout事件是在鼠标仍在rect上时触发的，但是文本元素就在鼠标的正下方，基本上是在鼠标和文本下方的rect之间

有没有办法让鼠标“看不见”文本

---

我想如果我们讨论的是WinForms/WPF，那么我在D3中寻找的分析功能就是类似于

ishitestable=false

的典型功能，不是吗。。。就在我提出这个问题的时候，解决方案出现了

为了对鼠标事件隐藏堆叠元素，请添加以下样式声明：

    .style("pointer-events", "none")