Threejs 카메라 회전 문제

나는 잘 문서화 된 문제를 안다. 그리고 내가 찾은 모든 해결책을 시도하면서, 광범위하게 수색했다. 그러나 나는 일하기위한 마지막 단계를 얻을 수 없다. 카메라가 추가 된 3D 개체가 있고 첫 번째 사용자 설정 작업 (카메라 순서는 YXZ로 설정 됨)을 얻으려고하고 X 축에서 개체를 회전하려고하면 그 결과로 나타나는 동작이 발생합니다. ..이상한. y 회전 (예 : 왼쪽/오른쪽보기)이 올바르게 작동합니다. 시뮬레이션의 시작 부분에서 x 회전을 변경하면 위아래로보기가 잘 작동하지만 왼쪽 또는 오른쪽을 보자 마자 위/아래를 보려고하면 가장 이상한 각도로 회전하여 장면을 만듭니다 나선. 여기에 코드의 일부이다 : 나는 바로이 문제에 대한 몇 가지 더 github의 질문을 읽고 순서로 회전 문제를 이해 한 Threejs 카메라 회전 문제

   camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 1, 1000);    

       neck = new THREE.Object3D(); 
       neck.rotateOnAxis(new THREE.Vector3(1, 0, 0), degInRad(90)); 
       neck.up = new THREE.Vector3(0, 0, 1); 
       neck.position.z = 10; 
       neck.position.y = -5; 
       neck.add(camera); 
       scene.add(neck); 

       if (leftPressed) { 
         neck.rotation.y += degInRad(1); //look left 
       } else if (rightPressed) { 
        neck.rotation.y -= degInRad(1);  //look right 
       } 
       if (upPressed) { 
        neck.rotation.x += degInRad(1);  //look up 
       } else if (downPressed) { 
        neck.rotation.x -= degInRad(1);  //look down 
       }

편집. 같아 지거나 내 질문의 더 지적 된 버전입니다 : x 회전이 y 회전에 영향을주지 않도록 변경하려면 lookAt() (또는 다른 메서드 사용)를 어떻게 변경해야합니까?

출처

2014-09-18 CoolGuyBananarama

목에 다른 노드 (Object3D)를 만드는 것은 어떻습니까? 아이디어는 회전을 위해 분리 된 두 좌표를 사용하는 것입니다. 그런 다음 y 축에서 새 노드를 회전하고 x 축에서 목을 회전시킬 수 있습니다. 팁 : 새 Object3d 노드에 목을 추가하는 것을 잊지 마십시오.

....... 
var neckNode = new THREE.Object3D(); 
neckNode.add(neck); 
scene.add(neckNode); 
....... 
if (leftPressed) { 
    neckNode.rotation.y += degInRad(1); //look left 
} else if (rightPressed) { 
    neckNode.rotation.y -= degInRad(1); //look right 
} 
if (upPressed) { 
    neck.rotation.x += degInRad(1);  //look up 
} else if (downPressed) { 
    neck.rotation.x -= degInRad(1);  //look down 
}

희망이 있습니다.

출처

2014-09-18 13:59:48

Threejs 카메라 회전 문제

답변

관련 문제