three.js - 结合 Object3D 组、PerspectiveCamera 和 FlyControl 的意外运动行为

Question

为了编写 HUD，我在 Object3D 中插入了一个摄像头，目的是将 HUD 元素放置在同一个 Object3D 中。

我现在没有更新相机，而是更新了 HUD，并希望更新其中的所有对象。然而，

• 移动鼠标时，相机似乎围绕场景中心旋转。
• 当按下用于向前移动相机的 W 时，我现在在场景中心前面侧向移动。

包括此处描述的精简行：

scene = new THREE.Scene();
hud = new THREE.Object3D();
camera = new THREE.PerspectiveCamera(...);
hud.add(camera);
scene.add(hud);

control = new THREE.FlyControls(hud, renderer.domElement);

Answer 1

您可以将 HUD Object3D 添加到相机，而不是相反。这应该按照人们的期望工作。

hud = new THREE.Object3D();
camera = new THREE.PerspectiveCamera(...);
camera.add(hud);
scene.add(camera);

control = new THREE.FlyControls(camera, renderer.domElement);