javascript - 如何在 Three.js 中设置相机的位置而不使其旋转?

标签 javascript three.js

我有一个使用 CSS3DObject 渲染工具用 Three.js 开发的界面。 我已将轨道设置为 0 以防止旋转并将我的移动限制为平移和缩放。

请注意,我也在使用 Orbit Control。

我使用以下代码将相机的位置设置为 x=-2000:

camera.position.x=-2000;
camera.position.z=4000;

当我这样做时,相机会移动位置,但仍然指向 (0,0,0),导致外观倾斜。 所以我假设我需要给它一个向量

camera.up = new THREE.Vector3(0,1,0);  //keeps the camera horizontal
camera.lookAt(new THREE.Vector3(2000,0,0));  //should point the camera straight forward

请注意,我仍在尝试找到有关如何设置lookAt 工作的良好解释。

最佳答案

经过更多研究,轨道控制似乎覆盖了camera.lookAt,因此没有执行任何操作。 为了实现平移,我将相机 x 位置的位置设置为等于目标的值。 我还删除了camera.up线。

var myCameraX = -2000;
var myCameraY = 500;

camera.position.x=myCameraX;
camera.position.y=myCamerYa;
control.target.set(myCameraX,myCameraY,0);

希望对某人有帮助。

关于javascript - 如何在 Three.js 中设置相机的位置而不使其旋转?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38311651/

相关文章:

javascript - 当父级在另一个路径中时将 iframe 更改为相对位置

javascript - 使用 Three.js 加载模型

三.js浏览器兼容性

javascript - 在球体表面堆积不规则圆

javascript - 对话框不是函数错误

javascript - page.aspx和code behind(page.aspx.vb)关系问题

javascript - 价格为零时隐藏价格

javascript - 如何仅在 ReactJS 中完成 http 请求后才进行渲染

TypeScript 错误 : node_modules/@types/three/three-core. d.ts(767,24):错误 TS2304:找不到名称 'Iterable'

javascript - 如何使用 Three.js 曲线作为移动网格的路径