How to move rotation point of element in Javascript?

Question

If i rotate image in EaselJS it rotates around 0,0 point how do i move it? Ty! Ras

Answer 1

You need to use translate(x,y) where x and y are the new rotation center you want.

Note: If you need to keep operating further, remember to un-translate it (translate again with same but negative values) after you are done with rotation, for this you will need to take into account how much you rotated it.

Answer 2

Subclasses of DisplayObject (Bitmap, Text, Shape, etc.) support regX and regY properties, which let you change the registration point of the object from the default:

• http://www.createjs.com/Docs/EaselJS/classes/DisplayObject.html#property_scaleX
• http://www.createjs.com/Docs/EaselJS/classes/DisplayObject.html#property_scaleY

I've found this helpful not just for rotation, but other effects as well, such as controlling how a Bitmap flips when setting a negative scaleX/Y.

Best, Chris