Using an orthographic camera

In most cases, you'll use THREE.PerspectiveCamera to render your scene. With such a camera, the result is a scene with a realistic-looking perspective. Three.js provides an alternative camera with THREE.OrthographicCamera. This camera uses an orthographic projection to render the scene. With this type of projection, all objects have the same size regardless of their distance to the camera. This is in contrast to THREE.PerspectiveCamera, where objects that are further away from the camera appear smaller. This was used often for fake 3D in games such as the Sims or older versions of SimCity (image taken from http://glasnost.itcarlow.ie/~powerk/GeneralGraphicsNotes/projection/projection_images/iosmetric_sim_city.jpg

Get Three.js Cookbook 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.