Drag, drop and shape rotation with Raphael JS

Question

I\'m using RaphaelJS 2.0 to create several shapes in a div. Each shape needs to be able to be dragged and dropped within the bounds of the div, independently. Upon double

Answer 1

my first thought was to use getBBox(false) to capture the x,y coordinates of the object after transform, then removeChild() the original Raphael obj from the canvas, then redraw the object using the coordinate data from getBBox( false ). a hack but i have it working.

one note though: since the object the getBBox( false ) returns is the CORNER coordinates ( x, y) of the object you need to calculate the center of the re-drawn object by doing ... x = box['x'] + ( box['width'] / 2 ); y = box['y'] + ( box['height'] / 2 );

where box = shapeObj.getBBox( false );

another way to solve the same problem