WebGL-based Three.js visualization

  • Article

Using the WebGL-based Three.js library, create moving objects with textures, a light source, shadows, and learn how to orbit, pan, and zoom a rendered scene. To show a step-by-step process, we'll model and visualize the orbits of these celestial systems in this order:

  1. The one-body problem (a single moving mass in space).
  2. The two-body problem (two mutually gravitating masses).
  3. The three-body problem (three mutually gravitating masses).

Before we do that, let's look at the basics of 3D graphics using the Three.js library.

The physics and equations of the two- and three-body problem