How do you figure the matrix on scale, rotate, translate, skew?

[zymir]

It's like, getComputedStyle(element).getPropertyValue("transform") returns matrix(a, c, b, d, tx, ty)♪ C translate It's kind of simple: translateX = tx♪ translateY = ty♪ And here's how to pull the scale, rotate, skew, I don't understand a little bit because in the first rotate and scale there should be degrees, second: Like, skewX = b♪ skewY = c♪ scaleX = a♪ scaleY = dbut to turn the element in the matrix a = cos(x)♪ b = sin(x)♪ c = -sin(x)♪ d cos(x)♪ In fact, from the set of parameters, the matrix I would have done, and here from the matrix, I don't understand how. Please tell me how to translate the matrix into an understandable, simple man's language or tell me how you can get your properties. transform Not matrix♪ scale♪ rotate♪ translate♪ skew?

[Raziyah00]

♪

Matrix you get. matrix(a, c, b, d, tx, ty) is presented as follows:

As you pointed out correctly: tx, ty - responsible for displacement.

The importance of the main diagonal, in our case. a,d, with that. a - wide scale, d - in height.

c,b - responsible for inclination

and all together. a,b,c,d - for the turn.

You can see more in the picture.

These changes are referred to as Athens, and they can be explained in detail:

https://en.wikipedia.org/wiki/Affine_transformation
http://compgraphics.info/2D/affine_transform.php