D3-在鼠标上方获得x位置[重复]

像 explained in MDN :

箭头函数表达式的语法比函数短 表达与 没有自己的这个 ,参数,超级,或 新目标这些函数表达式最适用于非方法 函数,它们不能用作构造函数。

箭头函数被引入到 pure functions 这就是为什么他们没有这种上下文变量的原因。

只需将箭头函数转换为常规函数。我用叉子叉了你的叉子:

https://plnkr.co/edit/3Y4T0JZ42eH2wb42tpsg?p=preview

d3.selectAll('.bar').on("mouseover", function(){
   console.log(d3.mouse(this)[0]);
   d3.select('.chart-tooltip').style("display", null)
})

更新:

您还可以用全局 d3.event.target 并将函数保持为箭头函数。

d3.selectAll('.bar').on("mouseover", () => {
  console.log(d3.mouse(d3.event.target)[0]);
  d3.select('.chart-tooltip').style("display", null)
})

更新二:

Gerardo Furtado proposed to use the third argument 获取html元素的回调函数。这也是一个很好的解决方案 d3.event 在某些情况下可能会有问题。

d3.selectAll('.bar').on("mouseover", (datum,index,elements) => {
  console.log(d3.mouse(elements[index])[0]);
  d3.select('.chart-tooltip').style("display", null)
})