Three.js: Get the Direction in which the Camera is Looking

Question

I\'m creating game in using html5 and THREE.js, and I have a camera that rotates with the euler order of \'YXZ\'.

This is so the camera rotation up, down, left and r

Answer 1

The camera is looking down its internal negative z-axis. So create a vector pointing down the negative z-axis:

var vector = new THREE.Vector3( 0, 0, - 1 );

Now, apply the same rotation to the vector that is applied to the camera:

vector.applyQuaternion( camera.quaternion );

You can get the angle in radians to the target like so:

angle = vector.angleTo( target.position );

---

EDIT: You can now get the direction in which the camera is looking like so:

var vector = new THREE.Vector3(); // create once and reuse it!
...
camera.getWorldDirection( vector );

Note: By passing in the vector in which to store the result, the method will not have to instantiate a new THREE.Vector3 every time the method is called.

Updated to three.js r.107