Moving the camera in the direction it's facing, with ThreeJS

Question

Say I have a camera placed at:

{
  x: 10,
  y: 30,
  z: 20
}

It\'s rotation is:

{
  x: 0.1,
  y: 0.2,
  z: 0.3
}


        

Answer 1

The THREE.Camera class extends the THREE.Object3D class. You can get the camera direction with the getWorldDirection method from the base class:

It returns a vector representing the direction in which the camera is looking, in world space.

When you have this direction vector you can use it to move the camera in the desired direction:

var direction = new THREE.Vector3();
camera.getWorldDirection( direction );

To move only 1 in that direction you can simply do:

camera.position.add( direction );

If you want to move more you could for example use the multiplyScalar method from the THREE.Vector3 class and multiply with the desired distance.

distance = 10;
camera.position.add( direction.multiplyScalar(distance) );

Answer 2

The camera looks down its local negative-z axis. So to move the camera in the direction it is facing, use this method:

camera.translateZ( - distance );

This is the most-efficient method.

three.js r.78