Packt+ | Advance your knowledge in tech

You're reading from Three.js Cookbook Over 80 shortcuts, solutions, and recipes that allow you to create the most stunning visualizations and 3D scenes using the Three.js library

Product type Paperback

Published in Jan 2015

Last Updated in Feb 2025

Publisher Packt

ISBN-13 9781783981182

Length 300 pages

Edition 1st Edition

Languages

JavaScript

Tools

Three.js

Concepts

Data Visualization

Author (1):

Jos Dirksen

View More author details

Table of Contents (9) Chapters

Preface

1. Getting Started FREE CHAPTER

2. Geometries and Meshes

3. Working with the Camera

4. Materials and Textures

5. Lights and Custom Shaders

6. Point Clouds and Postprocessing

7. Animation and Physics

Index

Using THREE.HemisphereLight for natural lighting

If you look at the lighting outside, you'll see that the lights don't really come from a single direction. Part of the sunlight is reflected by Earth, and other parts are scattered by the atmosphere. The result is a very soft light coming from lots of directions. In Three.js, we can create something similar using THREE.HemisphereLight.

Getting ready

Just like the other lights provided by Three.js, there is no need to include any additional JavaScript file to work with THREE.HemisphereLight. All you need is a scene with some objects, and you can add this light. To see the effect THREE.HemisphereLight object has, we've provided a simple example. Open up 05.04-create-a-sun-like-light.html in your browser. You will see something similar to the following screenshot:

With the controls in the top-right section, you can enable and disable THREE.HemisphereLight and THREE.DirectionalLight, which are used in this scene.