JavaScript graphics (more)

---

Three.js examples

• Examples at threejs.org
  • "Minecraft"
  • Dynamic terrain
  • Video background
  • Flock of birds
  • Car models with light reflection (open in separate page)
  • Human model walks and changes shape (open in separate page)
  • Animation of cloth blowing in wind
  • Physics - gravity on terrain
  • Physics - knock down blocks

• Examples by Prof. Lee Stemkoski
  • Video background
  • Plot 2D or 3D function

• Examples from the book Learning Three.js by Jos Dirksen
  • Includes Physics with Physijs.

---

How to select 3d objects with mouse

• Ray casting

• three.js
  • Ray
  • Raycaster

---

How to do collision detection

• Minimum bounding box

• three.js
  • Box3

• collision detection example

---

Physics JS library

We want a JS library to have real physics in our JS worlds.

• Physics engine

---

Physijs

• Physijs JS library allows use of physics in Three.js.

• github.com/chandlerprall
  • Physijs
  • examples
  • Wiki

• Physijs is dormant since 2015.

First person shooter in Three.js and Physijs.

---

ammo.js

• Alternative to Physijs
• Physijs actually uses ammo.js
• We can use ammo.js alone.

• ammo.js
• builds
  • ammo.js
  • ammo.wasm.js (Webassembly)

• Three.js examples using ammo.js
• They use a library:
  • AmmoPhysics.js
  • If including in page direct, you can comment out the "export" line.

• ammo.js is a JS port of Bullet
  • Bullet on Github
  • ammo.js is hard to use because it has no manual. It seems to assume you know how to use Bullet and this is similar.

• ammo.js tutorial

ancientbrain.com      w2mind.org      humphrysfamilytree.com

On the Internet since 1987.      New 250 G VPS server.

Note: Links on this site to user-generated content like Wikipedia are highlighted in red as possibly unreliable. My view is that such links are highly useful but flawed.