x工具提示的位置在d3堆叠条形图不工作 [英] x position of tooltip in d3 stacked bar chart not working

问题描述

我真的不知道为什么，但我的xPosition在堆叠条形图，我正在工作是不是真的工作。有人能告诉我做错了什么吗？

无论我将鼠标悬停在哪个栏，它总是出现在侧面：

感谢您的帮助。谢谢！

解决方案

检查控制台，控制台是您的朋友。你有很多NaNs。原因很简单：您的 rect 元素没有x属性。所以，这不工作：

  var xPos = parseFloat（d3.select（this）.attr（x） ）; 
  

相反，您必须获取作为相应父类的组的x rectangle：

  var group = d3.select（d3.select（this）.node（）。parentNode）; 
 var xPos = d3.transform（group.attr（transform））。translate [0]; 
  

这是您的工作代码： https://jsbin.com/dutetokoti/1/edit

I don't really know why but my xPosition in the stacked bar chart that I am working on is not really working. Can someone tell what I am doing wrong?

No matter what bar I hover over it always comes out on the side:

Here's a JS Bin code that I am working on: https://jsbin.com/qudoyewiba/edit?js,output

All help is appreciated. Thanks!

解决方案

Inspect the console, the console is your friend. You have a lot of NaNs. The reason is simple: your rect elements don't have a "x" attribute. So, this doesn't work:

var xPos = parseFloat(d3.select(this).attr("x"));

Instead, you have to get the "x" translation of the group that is the parent of that respective rectangle:

var group = d3.select(d3.select(this).node().parentNode);
var xPos = d3.transform(group.attr("transform")).translate[0];

Here is your working code: https://jsbin.com/dutetokoti/1/edit

这篇关于x工具提示的位置在d3堆叠条形图不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！