The threebody problem
Using the WebGLbased Three.js library, learn how to model and visualize the dynamics of the threebody problem.
The threebody problem
In the threebody problem, our hypothetical universe is composed of only three point masses. We provide the masses with some initial conditions and then let the system naturally evolve. Stated another way, the threebody problem is:
Given initial mass, position and velocity values for the three masses, predict their motions as a function of time
There is no general closedform solution to this problem, so we must numerically approximate its solution.
We look in more detail at the physics and mathematical details of the threebody problem, abstracted away in 3BodyWorker.js, in The physics and equations of the two and threebody problem. Let's look now at the threebody problem code.
The code
The source code for the threebody problem is available through 3BodyProblem.html and 3BodyWorker.js (rightclick to view source). 3BodyProblem.html is similar to 2BodyProblem.html. These are the only significant differences between the two:
 A third (and final) planetary bitmap,
images/moon.jpg
, is added to the list of images to preload.  A third
fieldset
element is added to obtainm3
's initial conditions.  The
worker
variable is made to refer to 3BodyWorker.js (instead of 2BodyWorker.js):worker = new Worker('3BodyWorker.js')

querySelectorAll, in
handleSubmitButton
, is used for a third time to setm3
's initial conditions:var m3 = InitialCondition(document.getElementById('mass3').querySelectorAll('input'))
.  The
init
method inSimulation
is passed all three mass objects:simulation.init([m1, m2, m3])
.
The differences between 3BodyWorker.js and 2BodyWorker.js are syntactically trivial. That said, to fully understand 3BodyWorker.js, it may be necessary to:
 Read and understand The physics and equations of the two and threebody problem and, as appropriate, review the resources in the Related topics section of this topic.
 Review each line of 3BodyWorker.js, including all code comments. Be aware that the code comments within 3BodyWorker.js refer to the equation numbers presented in The physics and equations of the two and threebody problem.
Related topics
 Basic 3D graphics using Three.js
 The onebody problem
 The threebody problem
 The physics and equations of the two and threebody problem