Calculate original coordinate after changing the transformation matrix

148 Views Asked by At

I am working with HTML5 canvas : I apply 2 transformations :

  1. Translate my canvas to (x,y)
  2. Rotate it with an angle a.

Then I draw a circle at the position (x1,y1)

I calculated my transformation matrix which is :

[ cos(a) sin(a) x ]
[-sin(a) cos(a) y ]

Now I want to know what is the coordinate (x2,y2) of my circle in the default frame.

How can I achieve that ? (I tried to multiply the inverse matrix with [x1,y1,1] but it doesn't seems to work)

My goal is that when the user click somewhere in the canvas, to check if the click inside the circle or not. So I need to have its "normal" coordinate.

thanks !

1

There are 1 best solutions below

0
On

I found the answer :

I have to solve the system :

[ cos(a) sin(a) x ]  *  [ x2 ] = [ x1 ]
[-sin(a) cos(a) y ]     [ y2 ]   [ y1 ]
                        [  1 ] 

And search for x2,y2