如何逆向工程化webkit matrix3d变换 [英] How to reverse-engineer a webkit matrix3d transform

问题描述

我有一个立方体元素在3d空间中被旋转和翻译。

I've got a cube element being rotated and translated in a 3d space.

我想要找出在给定时间的这个变换。这是可能吗？

I want to find out just the rotateY portion of this transform at a given time. Is this possible?

我有：

var cube = document.getElementById("cube");
var transform = getComputedStyle(cube).webkitTransform;

//the value of transform is:
// matrix3d(-1, 0, 0.00000000000000012246467991473532, 0, 
//           0, 1, 0, 0, 
//          -0.00000000000000012246467991473532, 0, -1, 0, 
//           0, 0, 0, 1)

b $ b

帮助？ ： - ）

Help? :-)

推荐答案

如果你的对象只是围绕Y旋转，那么旋转是很容易计算的 - 矩阵元素1,1,6,3或3的arccos， - 元件1,3的 - （元件3,1）或arcsin。在你的具体例子中，它是大约180度。如果旋转大约只是y轴，那么你必须开始跟踪以前的旋转，它可以变得更麻烦。

If your object is only being rotated about Y, then yes, the rotation is simple to calculate - it's the arccos of Matrix elements 1,1 or 3,3 or the arsin of -(element 3,1) or arcsin of element 1,3. In your specific example, it's about 180 degrees. If the rotations are about more than just the y axis, then you have to start tracking previous rotations and it can get messier.

您的翻译将只是底行输出矩阵，在这种情况下为0,0,0。

Your translation will just be the bottom row of the output matrix, 0,0,0 in this case.

查看
上的示例 http://www.inversereality.org/tutorials/graphics%20programming/3dwmatrices.html

这篇关于如何逆向工程化webkit matrix3d变换的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！