three.js - 如何使用鼠标旋转对象（但不使用摄像头）

Question

我想要创建大量对象并使用鼠标分别旋转它们中的每一个。到目前为止，我可以用鼠标选择其中一个对象，但我不能使用鼠标来旋转对象。

1. 当鼠标只有mouse.x = event.clientX - windowHalfX; mouse.y = event.clientY - windowHalfY;，我只知道如何使用鼠标移动和鼠标按下事件处理程序改变SELECTED.rotation.y和SELECTED.rotation.x（在选择时为选择目标） - 我怎么能控制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。