javascript - ThreeJS 相机朝向点

标签 javascript algorithm math rotation three.js

在 ThreeJS 中,如果相机以任何给定 Angular 旋转,我如何才能确定该点在相机朝向的方向上刚好 1 个单位的坐标。

如果你不熟悉 ThreeJS 相机旋转 Angular ,旋转会非常非常奇怪。

例如,如果我所有的旋转变量都是 0,那么该函数将返回 (0, 0, -1)。

如果旋转 x 是 Pi/2(90 度),则函数将返回 (1, 0, 0)

我如何创建一个函数来执行此操作?我不需要所有东西,主要是数学。

最佳答案

您想获得相机前一个单位的点的世界位置。

一种方法是在相机前面添加一个对象,并将其作为相机的子对象。然后你只需要查询对象的世界位置。

默认情况下,当相机的旋转 Angular 为 ( 0, 0, 0 ) 时,相机会向下看其负 z 轴。所以这是要遵循的模式:

var object = new THREE.Object3D();
object.position.set( 0, 0, - 1 );

scene.add( camera ); // this is required when the camera has children
camera.add( object );

现在,你可以像这样得到你需要的点:

var worldPos = new THREE.Vector3(); // create once and reuse it

...

camera.updateMatrixWorld(); // this is called in the render loop, so you may not have to call it again. Experiment.

worldPos.setFromMatrixPosition( object.matrixWorld );

three.js r.71

关于javascript - ThreeJS 相机朝向点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31172245/

相关文章:

javascript - 应用 CSS3 'Opacity' 属性

javascript - jQuery:点击时字母的随机位置

algorithm - 均匀奖品分配

java - 颜色逻辑算法

javascript - SVG 成功消息动画

c++ - 递归树,打印祖先节点

algorithm - 撕纸效果(将矩形分成随机形状)

math - 神经网络输出非二进制值?

java - Cloud Firestore 中的值在求和运算期间重复

javascript - 如何将以下 html 作为字符串包含在 javascript 中