I'm sure this question has been duplicated many times, however I cannot find any answers for my specific problem!
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 right like a head. As in first person view.
With this euler order, the z property in camera.rotation is not used (always 0). x is used to specify pitch or latitude in radians, and y is used depict the longitude.
I have a number of targets moving around the user in a spherical manner, with the camera constantly at the center of this sphere. Lets say the sphere has a radius of 1000.
My aim is calculate the angle between where the camera is LOOKING, and where the target is.
I wrote this code that calculates the angle between 2 vectors:
var A = new THREE.Vector3(1,0,0);
var B = new THREE.Vector3(0,1,0);
var theta = Math.acos( A.dot(B) / A.length() / B.length() );
// theta = PI/2;
The camera is looking down it's 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: Updated to three.js r.59