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); ...

Get 3D Game Programming for Kids, 2nd Edition 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.