Imperator
Imperator
Programming language:Whatever
2021-07-20 23:33:23
0
Q:

use matrix3d

Li-Pin Juan
Li-Pin Juan
Code: Whatever
2021-09-03 21:42:59 
The matrix3d() function is an alternative to the three-dimensional 
transform functions 
rotate3d(), rotateX(), rotateY(), rotateZ(), 
translate3d(), translateZ(), 
scale3d(), scaleZ(), and perspective().

so you say
  .rotated {
    transform: matrix3d(0.583333, 0.186887, 0.79044, 0, 
    -0.52022, 0.833333, 0.186887, 0, 
    -0.623773, -0.52022, 0.583333, 0, 
    0, 0, 0, 1);
  }
  
  instead of the more intuitive
   .rotated {
    transform: rotate3d(1,-2,1,60deg);
  }
BUT
Any time you do a CSS transform, you're affecting the matrix. 
Even if you use another function such as rotate3d(), 
you're still affecting the matrix. 
The matrix determines the coordinates of the element 
— its position, size, orientation, etc. 
These are all represented by sixteen number values.

a1, b1, c1, d1, a2, b2, c2, d2, a3, b3, c3, d3, d4 ... linear transformation.
a4, b4, c4 ...translation.

Another option is to use the Window.getComputedStyle() method to 
retrieve the computed value of the transform function.


 the matrix() function accepts 6 parameters FOR MERE two-dimensional space.
0

Tags

Related

New to Communities?

Join the community