Moving the Camera with the Avatar

The easiest way to keep the avatar on-screen is to move the camera wherever the avatar moves. If the camera is always pointed at the avatar, then the avatar can’t leave the screen!

Now, 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. We need to do the same thing 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​ leftFoot = ​new​ THREE.Mesh(foot, cover);
 leftFoot.position.​set​(75, -125, 0);
 avatar.add(leftFoot);
 
»avatar.add(camera);

After hiding the code, ...

Get 3D Game Programming for Kids, 2nd Edition now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.