Moving the Camera with the Avatar

Remember that to get the hands and feet to move along with our avatar, we added them to the avatar’s body instead of adding them to the scene. That is exactly what we need to do with the camera. First let’s find the line that says scene.add(camera) and delete it. Then, below the line where the avatar is added to the scene, and above the makeTreeAt function, let’s add the camera to the avatar:

 
var​ left_foot = ​new​ THREE.Mesh(foot, cover);
 
left_foot.position.set(75, -125, 0);
 
avatar.add(left_foot);
 
​ 
avatar.add(camera);

Add this line.

After hiding the code, you’ll see that when the avatar is moved, the camera stays right in front of the avatar.

It’s always 500 units in front of the avatar (camera.position.z ...

Get 3D Game Programming for Kids now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.