javascript - 堆叠条形图的 X Y 坐标

Question

我需要一些帮助来获取堆叠条形图中每个矩形的 X 和 Y 坐标。

我在这里创建一个悬停的新矩形。我希望在堆叠条形图的悬停矩形的右侧顶部创建。

这是我定义的鼠标悬停功能，问题是它只给出堆叠条的第一个矩形的 y 值。

function movein() {    var allRect = d3.selectAll("rect")                    // .transition()                    // .duration(300)                    .attr("opacity", 0)                    .attr("display", "none")    d3.select(this)      .attr("opacity", 1)      .attr("display", "block")      d3.select('.g')      .append("rect")      .attr("y", function(d) { return y(d.y1); })      .attr("x", 100)      .attr("height", 50)      .attr("width", 0)      .attr("z-index", 1000)      .attr("class", "rect-sec")      d3.select('.rect-sec')        .transition()        .duration(300)        .attr("width", 200)  };

有人请帮助获取悬停时堆叠条的每个矩形的 X 和 Y 坐标。

这是 link我指的是堆积条形图。

Answer 1

您可以在处理程序中选择 this 以访问当前元素，即您会这样做

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

获取 x 坐标。