Despite hours of searching, I have been unable to find a solution to a fundamental issue in Three.js. I know the position of the camera (my eyes), the direction the camera is facing (my eyes), and the direction my head is pointing. I need to create the camera without considering camera angle, near/far properties, etc. The closest code I have come up with is:
camera = new THREE.PerspectiveCamera(150, window.innerWidth / window.innerHeight, 0.1, 5000);
camera.position.x = myParams.eye_x;
camera.position.y = myParams.eye_y;
camera.position.z = myParams.eye_z;
camera.rotateOnAxis(new THREE.Vector3(0,0,1), Math.PI /2);
camera.rotateOnAxis(new THREE.Vector3(0,0,1), Math.PI * (myParams.eye_deg2)/180);
camera.rotateOnAxis(new THREE.Vector3(sin(myParams.eye_deg2),-cos(myParams.eye_deg2),0), Math.PI * (myParams.eye_deg1+90)/180);
camera.updateProjectionMatrix();
where eye_deg1 represents the vertical direction of the eyes (-90 for looking down, 90 for looking up), and eye_deg2 refers to the direction in the xy-plane (0 for -x direction).
The first two rotations could be combined into one step. The third rotation doesn't work properly.
Switching the order of setting the position and rotation does not seem to make a difference (does rotation not commute with translation?).
Ultimately, I just need a function that generates the camera without an in-depth explanation. It's frustrating that solving such a simple issue requires delving into a 600 page book on 3D graphics...
The eye vector is calculated as (-cos a1 cos a2, -cos a1 sin a2, sin a1), where a1 = eye_deg1 and a2 = eye_deg2. Three.js defaults to (0,0,-1) with a1 = -90 (looking down).
The head vector is determined as (-sin a1 cos a2, -sin a1 sin a2, cos a1). Three.js defaults to (0,1,0) with a2 = 90.
For instance, with a1 = 0, the eye vector becomes (-cos a2, -sin a2, 0), while the head vector is (0,0,1).