THREEJS：在看的时候旋转相机在

我在相机容器中有一个移动的相机，它像飞机一样在飞行路线上飞行;所以它可以移动到任何位置x，y，z正面和负面。相机容器使用样条曲线查看他自己的未来路径。THREEJS：在看的时候旋转相机在

现在我想用鼠标方向旋转相机，但仍然保持一般看着位置，同时向前移动物体。你可以说，我想把我的头转到我的身体上：在移动身体时，一般会看着方向，我转过头来说220度的上下。所以我不能在身后看。

在我的代码中，cameraContainer负责移动曲线并查看移动方向。相机将作为孩子添加到使用鼠标负责旋转的cameraContainer中。

我不能正常工作的是相机的旋转。我猜它是一个非常普遍的问题。让我们说摄像机只在x轴上移动时不会移动，它会像曲线一样移动。特别是在不同的相机位置，旋转看起来非常不同。我试图用cameraContainer来避免这个问题，但问题似乎与世界坐标无关。

这里是我有：

// camera is in a container 
cameraContainer = new THREEJS.Object3D(); 
cameraContainer.add(camera); 
camera.lookAt(0,0,1); 
cameraContainer.lookAt(nextPositionOnSplineCurve); 


// Here goes the rotation depending on mouse 
// Vertical 
var mouseVerti = 1;  // 1 = top, -1 = bottom 
if(window.App4D.mouse.y <= instance.domCenterPos.y)    // mouse is bottom? 
    mouseVerti = -1; 

// how far is the mouse away from center: 1 most, 0 near 
var yMousePerc = Math.abs(Math.ceil((instance.domCenterPos.y - window.App4D.mouse.y)/(instance.domCenterPos.y - instance.domBoundingBox.bottom) * 100)/100); 
var yAngleDiffSide = (instance.config.scene.camera.maxAngle - instance.config.scene.camera.angle)/2; 
var yRotateRan = mouseVerti * yAngleDiffSide * yMousePerc * Math.PI/180; 
instance.camera.rotation.x += yRotateRan;  // rotation x = vertical 


// Horizontal 
var mouseHori = 1;  // 1 = top, -1 = bottom 
if(window.App4D.mouse.x <= instance.domCenterPos.x)    // mouse is left? 
    mouseHori = -1; 

// how far is the mouse away from center: 1 most, 0 near 
var xMousePerc = Math.abs(Math.ceil((instance.domCenterPos.x - window.App4D.mouse.x)/(instance.domCenterPos.x - instance.domBoundingBox.right) * 100)/100); 
var xAngleDiffSide = (instance.config.scene.camera.maxAngle - instance.config.scene.camera.angle)/2; 
var xRotateRan = mouseHori * xAngleDiffSide * xMousePerc * Math.PI/180; 
instance.camera.rotation.y += xRotateRan;  // rotation y = horizontal

会很感激，如果有人可以给我一个提示！

来源

2013-05-13 Markus Siebeneicher

我敢打赌，问题是你只是不明白欧拉角如何工作。试试这个：'camera.eulerOrder =“YXZ”'。这对你来说会更直观。不要根据鼠标坐标增加旋转_assign_基于鼠标坐标的旋转。保持容器固定，直到您了解相机旋转的工作方式。 – WestLangley 2013-05-13 21:54:15

谢谢韦斯利指点我到欧拉角度。事实上，我不清楚。 – 2013-05-14 21:25:26

经过一些试验和错误之后，我得到了答案。解决办法是简单地考虑y的初始旋转。

当将相机容器和真实相机设置为容器的子容器时，我必须将相机指向相机容器对象的正面，以便让相机朝正确的方向看。这导致0,3.14,0（x，y，z）的初始旋转。每当我指定（如WestLangley提到的）鼠标旋转时，解决方案是将3.14添加到y旋转。

cameraReal.lookAt(new THREE.Vector3(0,0,1)); 
cameraReal.rotation.y = xRotateRan + 3.14;

来源

2013-05-14 21:32:51

THREEJS：在看的时候旋转相机在

回答

相关问题