Javascript D3中的鼠标事件和笔刷

我目前正在尝试自定义在上找到的时间序列图示例。这是使用nvd3实现的，nvd3是d3之上的一个库。我希望在顶部图形中有数据点的工具提示，但也希望能够在同一个图形中选择一个范围，就像示例中底部的“取景器”图形一样

为此，我在基本折线图的示例中添加了一个“笔刷”（请参见）。范围选择就像一个符咒，但是，数据点的工具提示不再起作用，除了刚刚超出轴范围的点。看起来，位于画笔区域的数据点不再获得鼠标事件，画笔吸收了所有这些事件

行的数据点接收鼠标事件需要更改哪些内容（特别是mouseover，我不关心单击）

尝试使用以下方法捕获所有事件：

d3.select(window).on("...", function) 

---

然后在数据点上触发一些“鼠标悬停”事件（如果适用）。这是如何实现的（我不想检查所有的数据点，然后检查哪一个最接近mouseevent…）？有没有更直接的方法？

因为画笔覆盖会抓取你的鼠标事件-你需要它-我不确定你是否可以绕过这个问题。最终，事件冒泡只适用于DOM树，这些元素最多只能是兄弟元素

您可能不需要迭代所有数据点，而可以只迭代笔刷选择的数据点。查看

如果您要检查“画笔”上任何位置的元素（Chorme），您将注意到在您试图捕捉事件的其他图形元素之后构建的元素

d3.brush函数创建一个隐藏的背景来捕捉鼠标事件

// An invisible, mouseable area for starting a new brush.
      bg.enter().append("rect")
          .attr("class", "background")
          .style("visibility", "hidden")
          .style("cursor", "crosshair");

---

因此，解决方法是在绘制数据（线、路径、散点图圆等）之前调用画笔。我意识到画笔覆盖了其他物体（在我的例子中是圆）。所以，首先我创建了笔刷矩形，然后我创建了其他对象。这样我也可以访问其他对象的事件