webgl-physics-examples

Examples of WebGL Physics Library.

Minimum examples

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	PhysX	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Ashes				Link
Babylon.js	Link	Link	Link	Link
ClayGL				Link
CZPG.js				Link
GLBoost				Link
Grimoire.js				Link1 / Link2
Hilo3d				Link
PlayCanvas	Link
Rhodonite			Link	Link
three.js	Link	Link1 / Link2	Link	Link1 / Link2	Link	Link
XenoGL				Link1 / Link2

Domino examples

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	PhysX	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js	Link	Link	Link	Link
ClayGL				Link
GLBoost	Link	Link		Link
Grimoire.js		Link		Link1 / Link2
Hilo3d				Link
PlayCanvas	Link
Rhodonite			Link	Link
three.js	Link	Link1 / Link2	Link	Link1 / Link2	Link	Link

Falling Football examples

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	PhysX	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js	Link	Link	Link	Link
ClayGL				Link
GLBoost	Link	Link		Link
Grimoire.js		Link		Link
PlayCanvas	Link
Rhodonite			Link	Link
three.js	Link	Link1 / Link2	Link	Link1 / Link2	Link	Link

Stacked Boxes examples

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	PhysX	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js	Link	Link	Link	Link
ClayGL				Link
GLBoost		Link		Link
Grimoire.js		Link		Link
PlayCanvas	Link
Rhodonite			Link	Link
three.js	Link	Link1 / Link2	Link	Link1 / Link2	Link	Link

Falling Balls examples

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js	Link	Link	Link	Link
ClayGL				Link
GLBoost				Link
Grimoire.js				Link
PlayCanvas	Link
Rhodonite			Link	Link
three.js		- / Link	Link	Link1 / Link2	Link

Falling glTF examples

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js	Link	Link	Link	Link
PlayCanvas	Link
Rhodonite			Link
three.js			Link	Link1 / Link2	Link

Falling Marbles examples (Using glTF)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js	Link	Link	Link	Link
PlayCanvas	Link
three.js		Link	Link		Link
Rhodonite			Link	Link (WIP)

Falling Shogi examples

Havok versions (WebGL 1.0 / WebGL 2.0 / WebGPU) include tuned shogi collider sizes to better match the rendered piece dimensions.

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js			Link
GLBoost				Link
three.js		Link	Link		Link
Rhodonite			Link	Link (WIP)

Falling Cone examples

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link	Link
WebGL 2.0			Link	Link
WebGPU			Link	Link
Babylon.js			Link
PlayCanvas	Link
Rhodonite			Link
three.js			Link	Link1 / Link2	Link

Basic Shapes example (glTF Physics extension)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link (WIP)
WebGL 2.0			Link (WIP)
WebGPU			Link (WIP)
Babylon.js			Link (WIP)
PlayCanvas	Link
three.js			Link		Link

Materials Friction example (glTF Physics extension)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link
WebGL 2.0			Link
WebGPU			Link
Babylon.js			Link
PlayCanvas	Link
three.js		Link (WIP)	Link	Link	Link

Materials Restitution example (glTF Physics extension)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link
WebGL 2.0			Link
WebGPU			Link
Babylon.js			Link
PlayCanvas	Link
three.js			Link		Link

Motion Properties example (glTF Physics extension)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link (WIP)
WebGL 2.0			Link (WIP)
WebGPU			Link (WIP)
Babylon.js			Link (WIP)
PlayCanvas	Link
three.js			Link		Link

Filtering example (glTF Physics extension)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link (WIP)
WebGL 2.0			Link (WIP)
WebGPU			Link (WIP)
Babylon.js			Link
PlayCanvas
three.js			Link

Triggers example (glTF Physics extension)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link (WIP)
WebGL 2.0			Link (WIP)
WebGPU			Link (WIP)
Babylon.js			Link
PlayCanvas
three.js			Link

JointTypes example (glTF Physics extension)

Library	ammo.js	Cannon.js / cannon-es	Havok	Oimo.js / OimoPhysics	rapier
WebGL 1.0			Link (WIP)
WebGL 2.0			Link (WIP)
WebGPU			Link (WIP)
Babylon.js			Link
PlayCanvas
three.js			Link

Physics Library Unit Systems

All physics libraries used in this project adopt the SI (International System of Units): meters (m), kilograms (kg), seconds (s), and newtons (N).
The convention 1 unit = 1 meter is recommended for stable simulation results.

Library	Unit System	Recommended Scale	Notes
ammo.js (Bullet)	SI (m / kg / s / N)	0.05 – 10 m	Most sensitive to scale; official docs strongly recommend matching real-world meter scale
Cannon.js / cannon-es	SI (m / kg / s / N)	Flexible	Relatively tolerant of scale variation
Havok	SI (m / kg / s / N)	0.1 – 10 m
Oimo.js / OimoPhysics	SI (m / kg / s / N)	0.1 – 10 m
PhysX	SI (m / kg / s / N)	0.1 – 10 m
rapier	SI (m / kg / s / N)	Flexible	Good numerical stability across a wide range of scales

Tip: Objects smaller than ~0.05 m or larger than ~100 m may cause floating-point instability (jitter, tunneling). Keep rigid bodies within the recommended scale range for best results.