I am writing some vector shape transform demo , and I am stucked:
There is a transform matrix datas got from some shape :
matrix = [3.23891, -0.87126, 246.73324, 1.07431, 0.86589, 169.21047, 0, 0, 1]
Then I use a decomposeMatrix
method (comes from here : https://frederic-wang.fr/decomposition-of-2d-transform-matrices.html) to split the matrix to translation
,scale
,rotation
,skew
, I make these values recorded in a new shape
class , when I refresh the canvas , this shape
instance will invoke a method to calculate its local matrix via these pose values, I thought it will return a almost same matrix with the matrix decomposed before, but not.
From the matrix I got there datas:
rotation: 0.32026899072894127
scale: {x: 3.412432386032404, y: 1.0961547154147515}
skew: {x: -0.16104628632010806, y: 0}
translation: {x: 246.73324584960938, y: 169.21047973632812}
I compared these datas with "https://frederic-wang.fr/decomposition-of-2d-transform-matrices.html" web page , they are same , and the web page demo can get the correct image pose result I expected.
So I tought maybe my matrix multiply method was wrong?
The matrix concat order is :
Local = Translate * Rotate * Skew * Scale
And I tried other concat order , such like T * R * Sc * Sk
, but I still can not get correct result.
Dear family , can you help me to resolve this problem? 比心!
Thanks family! I resolve it! skew transform was wrong and the order should be Translate * Rotate * Scale * Skew