0

In ThreeJS, if the camera is rotated at any given angle, how can I determine the coordinate of the point exactly 1 unit in the direction that the camera is facing.

If you are unfamiliar with ThreeJS camera rotation angles, the rotations are very very weird.

For example, if all of my rotation variable are 0, then the function would return (0, 0, -1).

If the rotation x is Pi / 2 (90 degrees), then the function would return (1, 0, 0)

How could I create a function to do this? I don't need everything, primarily just the math.

James McDowell
  • 2,668
  • 1
  • 14
  • 27
  • what are the "angles" you mention and what rotations do they represent (axis, sequence etc). –  Jul 01 '15 at 21:47
  • ThreeJS camera rotation angles are weird. If you haven't used it, it is very confusing. I'll update the problem to make it more clear – James McDowell Jul 01 '15 at 21:48
  • Also, the angles have to be in radians, so PI / 2 is 90 degrees – James McDowell Jul 01 '15 at 21:54
  • if you have the camera expressed in terms of its _matrix_ (rather than angles), then http://stackoverflow.com/questions/14023764/how-to-get-orientation-of-camera-in-three-js has the answer. you can calculate the camera direction, and if you know its position you can calculate the point you need. –  Jul 01 '15 at 22:01
  • 1
    You have a number of false statements in your post. You are going to have to experiment until you understand how rotations work in three.js. – WestLangley Jul 01 '15 at 23:04

1 Answers1

2

You want to get the world position of a point that is one unit in front of the camera.

One way to do that is to add an object in front of, and as a child of, the camera. Then you just need to query the world position of the object.

By default, when a camera's rotation is ( 0, 0, 0 ), the camera is looking down its negative z-axis. So here is the pattern to follow:

var object = new THREE.Object3D();
object.position.set( 0, 0, - 1 );

scene.add( camera ); // this is required when the camera has children
camera.add( object );

Now, you can get the point you need like so:

var worldPos = new THREE.Vector3(); // create once and reuse it

...

camera.updateMatrixWorld(); // this is called in the render loop, so you may not have to call it again. Experiment.

worldPos.setFromMatrixPosition( object.matrixWorld );

three.js r.71

WestLangley
  • 102,557
  • 10
  • 276
  • 276