Three.js - 将网格速度转换为网格旋转 [英] Three.js - Convert mesh velocity to mesh rotation
问题描述
假设我有一个three.js网格和一个速度矢量。
Suppose I have a three.js mesh, and a velocity vector3.
速度在其他地方被改变，然后每帧添加到mesh.position。
The velocity is being altered elsewhere, and then added to the mesh.position every frame.
我想要的是mesh.rotation对应于速度，即网格是一个总是指向它进入的方向的箭头。
What I want is for the mesh.rotation to correspond to the velocity, i.e, the mesh is an arrow that always points in the direction it's going in.
这是我尝试过的两种方法 - 让网格旋转是的，但只是在错误的角度和向后以及一切。
Here are two approaches I've tried - which get the mesh rotating yeah, but just at the wrong angles and backwards and everything.
//this doesn't work
mesh.rot.x = Math.atan2( vel.y, vel.z );
mesh.rot.y = -Math.atan2( vel.x, vel.z );
mesh.rot.z = Math.atan2( vel.x, vel.y );
//got this from a semi-related stackoverflow question; also doesn't work
mesh.rot.y = Math.asin( vel.z );
mesh.rot.z = Math.atan2( vel.y, vel.x );
var bankVec = new Vector3( -vel.y, vel.x, 0 );
var upVec = new Vector3( dot( bankVec, vel ) );
mesh.rot.x = Math.atan2(dot(bankVec, vel) / dot(upVec, vel),abs(bankVec)*abs(upVec));
我真的没有得到矢量数学。
I don't really get vector maths.
我现在正处于这样一个阶段：我只是随意改变标志并交换争论，希望能做到最好。因此，我将非常感谢任何关于如何做到这一点的解释。
I'm now at the stage where I'm just arbitrarily changing signs and swapping arguments around, hoping for the best. So any kind of explanation as to how I should be doing this would be much appreciated.
不是真正寻找代码，只是寻找点积的相关方程，交叉产品，atan2's，无论如何。
Not really looking for code, just looking for the relevant equation of dot products, cross products, atan2's, whatever.
推荐答案
您可以从归一化速度矢量构造旋转矩阵。归一化的向量是1轴。然后你以某种方式选择第二轴。然后你做一个十字产品来找到第三个轴。最后在第一个和第三个轴之间做一个交叉乘积来得到最后的第二个轴。
You can construct a rotation matrix from the normalized velocity vector. The vector, normalized, is 1 axis. Then you pick a 2nd axis somehow. Then you do a cross product to find the 3rd axis. Finally do a cross product between the first and 3rd to get the final 2nd axis.
然后你从3个向量构造一个3x3矩阵（我不记得它们的顺序此刻，但是像[x1，y1，z1，x2，y2，z2，x3，y3，z3]这样的东西。
Then you construct a 3x3 matrix from the 3 vectors (i can't remember their order at the moment, but something like [x1,y1,z1,x2,y2,z2,x3,y3,z3]).
另一种方法是Quaternion类：
Another method is the Quaternion class:
.setFromUnitVectors（vFrom，vTo）
.setFromUnitVectors ( vFrom, vTo )
将此四元数设置为旋转需要旋转方向
向量vFrom到方向向量vTo。改编自
http://lolengine.net /博客/ 2013/09/18 /美丽 - 数学 - 四元数，从矢量的。假设
vFrom和vTo被标准化。
Sets this quaternion to the rotation required to rotate direction vector vFrom to direction vector vTo. Adapted from http://lolengine.net/blog/2013/09/18/beautiful-maths-quaternion-from-vectors. vFrom and vTo are assumed to be normalized.
http://threejs.org/docs/#Reference/Math/Quaternion
自内部three.js喜欢使用四元数，这可能是一个很好的方法。如果你的箭头是向上箭头，你可能想要vFrom = [0,1,0]，vTo = velocityVector.normalize（）;
Since internally three.js likes to use quaternions, this may be a good method. If your arrow is an upward pointing arrow, you probably want vFrom=[0,1,0], vTo=velocityVector.normalize();
这篇关于Three.js - 将网格速度转换为网格旋转的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
