3D Game Programming

And then you would have to repeat the same thing three more times to make

a total of four trees. Four trees would be a lot of typing. Don’t forget: we pro-

grammers don’t like typing. Always remember that we’re lazy. And the thing

that lets us be lazy this time is a function.

Also new here is color. We picked those colors from the Wikipedia list of color

names at http://en.wikipedia.org/wiki/X11_color_names. The tree trunk is the color

sienna. You can try your own colors if you like. The color comes from the first

column on that web page, but we need to replace the # symbol on the web

page with 0x so that JavaScript can read it. Thus, #A0522D becomes 0xA0522D.

Now that we have a forest, let’s see if we can make the camera move with the

avatar as it travels through the scene.

4.6 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:

varleft_foot =newTHREE.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 = 500). The camera

is always at the same height as the avatar since we never defined the camera’s

report erratum • discuss

Moving the Camera with the Avatar • 43

Prepared exclusively for Michael Powell