1

我正在尝试将hoverIntent与 D3 一起使用。现在， hoverIntent 就像jQuery 的 hover一样工作。

最初，我在 D3 中创建了 mouseOver 事件，如下所示：

nodes
  .on("mouseover", highlightNode)
  .on("mouseout", unhighlightNode)

但是，在其中使用“hoverIntent”（或“hover”）on是不可能的，因为它们是伪事件。

虽然 D3 选择器看起来就像 jQuery 选择器一样，但执行类似nodes.hover(highlightNode, unhighlightNode)的操作是不可能的。可以通过将“mouseenter”和“mouseleave”事件绑定到相应的处理程序来替换hover，但我看不到如何以hoverIntent类似的方式替换。

有没有办法分解hoverIntent成可以使用绑定的事件on？或者有没有办法将 D3 选择转换为 jQuery 选择？

4

1 回答 1

0

根据 Lars Kotthoff 的建议，我能够附加hoverIntent处理程序。

nodes.each (d, i) ->
  $(this).hoverIntent (-> highlightNode(d, i)), (-> unhighlightNode(d, i))

（CoffeeScript中的代码）

自然，highlightNode期待unhighlightNodeD3 元素，而不是 DOM 元素。D3 的each选择功能提供了 D3 元素（in d）和 DOM 元素（绑定到this）。

我this用来选择 DOM 元素并调用hoverIntent它。“mouseenter”和“mouseleave”的处理程序是匿名函数，它们调用现有的处理程序highlightNode并unhighlightNode使用各自的 D3 元素d。

于 2013-07-11T13:39:32.050 回答