How do I find the position of an element in raphael?

Question

I am using raphael to animate a ball and need to find out the position after stopping the animation, here is the code I have:

ball.stop();
console.log(ball.attrs.transform);
// t399.6625490203161,180r180

how do I convert this string into the x,y position of the ball?

Answer 1

You can use Element.getBBox for this:

var x = ball.getBBox().x;
var y = ball.getBBox().y;
var r = ball.getBBox().height / 2;
console.log(x, y, r);

---

But beware :

The coordinates ( element.getBBox().x , element.getBBox().y ) will refer to the upper left corner of the bounding box.
If the ball is a circle, that point will not even be contained in the circle and it might be more sensible to work with the coordinates of the center.

Given the bounding box bbox , to those would be

var x = bbox.x + bbox.width / 2,
    y = bbox.y + bbox.height / 2;