在鼠标悬停时更改d3类

Question

我正在使用d3 v4并尝试在鼠标悬停时将样式应用于元素。 我想知道它是否是V4的API更改，但我似乎无法进入节点

我有代码：

.on('mouseover', () => {
  let self = d3.select(this);
  let c = self.attr('class');

但这会产生错误

Cannot read property 'getAttribute' of null

所以d3.select()似乎不起作用...... 然而，鼠标悬停正在发射。

我可以用

.on('mouseover', (elem) => {
  console.log('elem', elem);

这将给我一些类型的D3对象，但不是DOM节点。 我不能在这个对象上使用任何D3方法

  elem.classed("hilite", true);
  elem.attr("class", "hilite");

这些方法都不存在于d3返回的对象上。

那么如何在d3中执行此超级基本操作？

相关 Change class of one element when hover over another element d3

Answer 1

如果您不需要访问当前元素的this，则可以使用箭头功能（如果这是箭头功能）。在这种情况下，您确实需要，因为D3调用事件处理程序将{{1}}设置为触发此事件的元素。

请参阅：Using arrow functions with d3