three.js - 如何用鼠标旋转对象（但不使用相机）

Question

我想创建很多对象并使用鼠标分别旋转它们。到目前为止，我可以使用鼠标选择其中一个对象，但我无法使用鼠标进行对象旋转。

1. 由于鼠标只有mouse.x = event.clientX - windowHalfX; mouse.y = event.clientY - windowHalfY;，我只知道如何使用mousemove和mousedown事件处理程序来更改SELECTED.rotation.y和SELECTED.rotation.x（其中SELECTED是所选对象） ） - 我如何控制SELECTED.rotation.z呢？

2. 如果所选对象是颠倒的，则x旋转也将向后移动，这似乎不太可取。有没有办法修改这个？

我发现很多例子都使用相机旋转而不是实际旋转物体。我想找到一种解决方案，可以在不更换相机的情况下旋转对象。

Answer 1

您应该从three.js中查看给定的控件示例。他们不舒服，大多数情况下你需要复制它们并按照你想要的方式进行修改。但他们采取的对象是控制器，可能是相机或物体。这是一个小例子：

yawLeft = -((event['pageX'] - fullWidth) - halfWidth) / halfWidth;
pitchDown = ((event['pageY'] - fullHeight) - halfHeight) / halfHeight;

rotationVector.x = (-pitchUp + pitchDown);
rotationVector.y = (-yawRight + yawLeft);
rotationVector.z = (-rollRight + rollLeft);

var tmpQuaternion = new THREE.Quaternion();
tmpQuaternion.set(rotationVector.x * rotMult, rotationVector.y * rotMult, rotationVector.z * rotMult, 1).normalize();
object.quaternion.multiplySelf(tmpQuaternion);

对象可以是相机或模型。没关系，因为相机也是THREE.Object3D。