javascript - three.js 使用轨道控件获取相机位置

标签 javascript three.js

我正在使用 three.js 轨道控件并尝试让天空盒跟随相机的位置。在互联网上搜索后,我没有找到合适的答案。

我的问题很简单 - 如何在使用轨道控制时检索相机的坐标,以下不起作用:

skybox.position.x = camera.position.x;  //Moving skybox with camera
skybox.position.z = camera.position.z;  //Moving skybox with camera
skybox.position.y = camera.position.y;  //Moving skybox with camera

x 和 z 坐标值不正确。我也试过:

orbit_controls.object.target

相反,但这会导致 x 和 z 返回不正确值的类似不正确行为。

看似明显的控制机制要求似乎非常难以做到。

最佳答案

由于没有得到关于 SO 的答案,我做了一些额外的测试,我发现需要进行坐标系转换才能检索相机的正确坐标。

以下将检索相机在标准世界 (x,y,z) 空间中的当前位置并将其应用于天空盒。

newZ = -(camera.position.x * Math.cos(5.49779)) - (camera.position.z * Math.sin(5.49779));
newX = (camera.position.x * Math.cos(0.78)) + (camera.position.z * Math.sin(0.78));

skybox.position.x = newX;   //Moving skybox with camera
skybox.position.z = newZ;   //Moving skybox with camera
skybox.position.y = camera.position.y;  //Moving skybox with camera

因为我在其他地方找不到这个答案,我希望这对其他人有用,它解决了我的问题。

关于javascript - three.js 使用轨道控件获取相机位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33962745/

相关文章:

javascript - 在 Three.JS 中向 Material 贴图添加纹理时出现 WebGL 警告

javascript - 将 Three.js 3D 模型保存在 PNG 中的位置(右、左、前、后)

javascript - TypeError : Cannot read property 'center' of undefined (Three. js + React.js)

javascript - 如何根据父 ID 替换字符串?

javascript - WKWebview 的 javascript 调用返回 nil

javascript - 同源图像 texImage2D 的安全错误

three.js - 有没有办法让一个 CSS2DObject 出现在另一个 CSS2DObject 之上?或者让它出现在场景中所有物体的顶部?

javascript - 如何让对象在垂直轴上并围绕另一个对象旋转 Three.js

javascript - jQuery addClass/removeClass 过渡不平滑而且卡顿

javascript - JSLint 语法逗号或分号