O'Reilly logo

Three.js Essentials by Jos Dirksen

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Adding trackball and keyboard controls

All that is left to do now is make it a bit friendlier to use. To do this, we'll add THREE.TrackballControls, which you can use to pan and move the camera around, and we'll configure some keyboard controls that you can use to move the cube around.

Adding trackball controls to the camera

With the trackball controls, you can very easily use your mouse to move the camera around the scene. The following table shows how you can move the camera around when this control is used:

Control

Action

Left mouse button and move

Rotate and roll the camera around the scene

Scroll wheel

Zoom in and zoom out

Middle mouse button and move

Zoom in and zoom out

Right mouse button and move

Pan around the scene

To configure ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required