三个 JS 从 matrixWorld 获取(世界)旋转

2022-01-16 00:00:00 position rotation javascript three.js

如何在 three.js 中获得 Object3D 的世界旋转?我知道如何从 object.matrixWorld 获取 Object3D 的世界位置，但是如何获取对象的世界旋转?

How do I get the world rotation of an Object3D in three.js? I know how to get the world position of an Object3D from object.matrixWorld, but how do I get the world rotation of an object?

我需要这个来解决以下问题:我有一个像这样的分层对象结构:

I need this for the following problem: I have a hierarchical Object structure like this:

var obj1 = new THREE.Object3D();
obj1.x = 200;
obj1.rotation.x = 0.1;
scene.add(obj1);

var obj2 = new THREE.Object3D();
obj2.y = -400;
obj2.rotation.y = 0.21;
obj1.add(obj2);

var obj3 = new THREE.Object3D();
obj3.z = -200;
obj3.rotation.x = 0.1;
obj3.rotation.y = -0.1;
obj2.add(obj3);

现在我想让我的相机在一定距离内正交地看 obj3.当我的对象不旋转时，它的工作原理如下:

Now I want to make my camera look at obj3 orthogonally in a certain distance. When My Objects are not rotated, this works like this:

var relativeCameraOffset = new THREE.Vector3(0, 0, 500); // 500 is z-distance from my object
var cameraOffset = relativeCameraOffset.applyMatrix4(obj3.matrixWorld);
camera.position = cameraOffset;

当只有我的最后一个孩子被旋转时，当我添加这一行时，我得到了我想要的

When only my last child is rotated I get what I want when I add this line

camera.rotation = obj3.rotation;

但是当所有父元素都旋转时，这不起作用.所以我正在寻找一种方法来获得我的 3D 对象的世界方向".谢谢.

But when all parent Elements are rotated this is not working. So I'm looking for a way to get the world "orientation" of my 3D object. Thanks.

推荐答案

获取世界"旋转的一种方法如下:

One way to get the "world" rotation is as follows:

var position = new THREE.Vector3();
var quaternion = new THREE.Quaternion();
var scale = new THREE.Vector3();

mesh.matrixWorld.decompose( position, quaternion, scale );

然后您可以像这样设置相机方向:

You can then set your camera orientation like so:

camera.quaternion.copy( quaternion );

重要提示:如果您要直接访问 matrixWorld，您必须确保它已更新.渲染器通常在渲染循环中为您执行此操作.但是，如果您在渲染调用之间，并且需要强制更新矩阵，则可以使用

Important: if you are going to access matrixWorld directly, you have to make sure it is updated. The renderer typically does this for you in the render loop. If, however, you are between render calls, and need to force an update of the matrix, you can do so with

mesh.updateMatrixWorld( true );

现在有一种新方法可用.检查源代码，看看它在做什么.

There is a new method that is now available. Check the source code so you see what it is doing.

Object3D.getWorldQuaternion( optionalTarget );

three.js r.69

three.js r.69

相关文章