Question

以下是我想做的事情：

验证条件后，我想旋转场景中的所有内容，包括相机。

用户不会发现任何差异，因为相机仍然显示完全相同的东西，但事实上对象会被旋转。

当然轨道控制器还应该工作......

这个问题可能很愚蠢，但我遇到了麻烦。相机移动并且没有显示完全相同的东西，或者轨道控制器无法工作。

你会怎么做？

感谢。

编辑：我应该详细说明我尝试的内容。

所以，让我们说我场景中唯一的东西是每个脸上都有数字的立方体。

面部1指向+ X.
脸部2指向+ Y.
脸部3指向+ Z。
面部-1指向-X。
脸-2指向-Y。
脸-3指向-Z。

在我的代码中的某个时刻，我希望在用户不知情的情况下旋转立方体。

面部1仍应指向+ X.
面部-1仍应指向-X。

但是：

面部2应指向+ Z。
面-2应指向-Z。
面部3应指向-Y。
脸部-3应指向+ Y.

好吗？

但我不希望用户注意到这种轮换。所以我想在同一时间旋转相机，以隐藏立方体旋转的事实。

我尝试了什么：

当我想要旋转X时：

cube.rotateX(direction * Math.PI / 2);
camera.position.set(camera.position.x, direction * (-camera.position.z), direction * camera.position.y);
camera.lookAt(new THREE.Vector3(0, 0, 0));

当我想要旋转Y时：

cube.rotateY(-direction * Math.PI / 2);
camera.position.set((-direction) * camera.position.z, camera.position.y, -direction * (-camera.position.x));
camera.lookAt(new THREE.Vector3(0, 0, 0));

可悲的是，尽管它适用于Y旋转，但它不适用于X旋转，因为camera.up会将其操作并使其看起来像绕Y轴旋转。

我该怎么办？

Answer 1

尝试创建THREE.Group并将当前场景中的所有内容添加到其中（您的立方体，相机，灯光等）。然后旋转组。

var group = new THREE.Group();
group.add(yourCube);
group.add(yourLight);
group.add(yourCamera);
scene.add(group);
// later...
group.rotateN(90 * Math.PI / 180); // whatever rotation function you choose to use

从此时开始添加到群组的任何内容都将使用群组的坐标系。添加到场景中的任何内容都将继续使用标准世界坐标系。

如果再次旋转组，组内的任何内容都会随之旋转，但场景中的任何内容都将保留在原位。

THREE.JS：尽管有轨道控制器，仍然可以旋转每一个（包括摄像机）

1 个答案: