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;