THREE JS get (world) rotation from matrixWorld(三个 JS 从 matrixWorld 获取(世界)旋转)
问题描述
如何在 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
这篇关于三个 JS 从 matrixWorld 获取(世界)旋转的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:三个 JS 从 matrixWorld 获取(世界)旋转


基础教程推荐
- 每次设置弹出窗口的焦点 2022-01-01
- jQuery File Upload - 如何识别所有文件何时上传 2022-01-01
- 什么是不使用 jQuery 的经验技术原因? 2022-01-01
- 如何在特定日期之前获取消息? 2022-01-01
- Javascript 在多个元素上单击事件侦听器并获取目标 2022-01-01
- 为什么我在 Vue.js 中得到 ERR_CONNECTION_TIMED_OUT? 2022-01-01
- WatchKit 支持 html 吗?有没有像 UIWebview 这样的控制器? 2022-01-01
- 如何使用sencha Touch2在单页中显示列表和其他标签 2022-01-01
- 如何使用 CSS 显示和隐藏 div? 2022-01-01
- Node.js 有没有好的索引/搜索引擎? 2022-01-01