X Y Co-ordinates of Stacked Bar

Question

I need some help in getting the X and Y Co-ordinates of a stacked bar chart for each rect in the stacked bar chart.

I'm here creating a new rectangle on hover. I want the to be created on right side top of the hovered rectangle of the stacked bar chart.

Here's the mouse over function I've defined, problem is it's giving the y value of only the first rect of a stacked bar.

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)
  };

Someone please help in getting X and Y co-ordinates of each rectangle of a stacked bar on hover.

This is the link where i'm refering for the stacked bar chart.

You haven't defined an .on("mouseover" function, but inside that you get access to the current element using d3.select(this). — Lars Kotthoff
Above is the mouseover function where I call it like this .on("mouseover", movein). You want the entire code? — Unknown User
Ok, so you would do d3.select(this).attr("x") to get the x coordinate of the currently selected rect. — Lars Kotthoff
Thank you. I got it. Thanks a lot. Please make that as answer. — Unknown User
And can you let me know to align the text to the middle in stacked bar? — Unknown User

Lars Kotthoff Lars Kotthoff · Accepted Answer · 2013-12-04T13:39:10

You can select this inside the handler to get access to the current element, i.e. you would do

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

to get access to the x coordinate.

X Y Co-ordinates of Stacked Bar

1 Answers