This example features simple player input controls with a smooth 3rd person follow camera.
Simply handles user input with document.onkeydown events and applies it accordingly to player mesh.
this.input = {x:0 ,y:0};
document.onkeydown = function myFunction()
{
switch (event.keyCode) {
case 38:
//UP
this.input.y = 1;
break;
case 40:
//DOWN
this.input.y = -1;
break;
case 37:
//RIGTH
this.input.x = -1;
break;
case 39:
//LEFT
this.input.x = 1;
break;
}
}
Apply player matrix to camera matrix with an offset. Finally interpolate between the current camera position and the desired camera position with Math.lerp function.
function followCamera()
{
//Offset from camera to player
var relativeCameraOffset = new THREE.Vector3(0,5,10);
//UPDATE PLAYER WORLD MATRIX FOR PERFECT CAMERA FOLLOW
player.updateMatrixWorld()
//Apply offset to player matrix
var cameraOffset = relativeCameraOffset.applyMatrix4( player.matrixWorld );
//SMOOTH CAMERA POSITION TO TARGET POSITION
camera.position.lerp(cameraOffset, 0.1);
camera.lookAt( player.position );
}