This simulation solves the Navier-Stokes equations for incompressible fluids. The fluid visualization includes thousands of Lagrangian particles that follow the velocity field and leave behind semi-transparent trails as they move. All computation happens in several GPU fragment shaders for real-time performance. Written by Amanda Ghassaei.
Instructions: Touch/mouseover to apply a force to the fluid. Toggle between showing the underlying pressure and velocity fields using the controls on the right. Press "v" to record a video.
To learn more about the math involved, check out the following sources:
Real-time ink simulation using a grid-particle method - mixing Eulerian and Lagrangian techniques for fluids.Fast Fluid Dynamics Simulation on the GPU - a very well written tutorial about programming the Navier-Stokes equations on a GPU. Though not WebGL specific, it was still very useful.
Fluid Simulation (with WebGL demo) - this article has some nice, interactive graphics that helped me debug my code.
Stable Fluids - a paper about stable numerical methods for evaluating Navier-Stokes on a discrete grid. Also check out Stam's book The Art of Fluid Animation.
This page is part of a series of examples using gpu-io, a GPU-accelerated computing library for physics simulations and other mathematical calculations. Find the source code on Github.