Skip to content
master
Switch branches/tags
Code

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
Apr 2, 2017
Oct 7, 2017
Oct 7, 2017
Oct 7, 2017
Oct 7, 2017
gif
Jun 23, 2017

VortexShedding

A realtime fluid flow simulation on the GPU using WebGL

Live demo at apps.amandaghassaei.com/VortexShedding/

This simulation solves the Navier-Stokes equations for incompressible fluid flow past an obstacle in a GPU fragment shader. It exhibits a phenomenon called vortex shedding, where vortices of alternating spin spontaneously emerge behind the obstacle. To increase performance, I solved for the velocity vector field of the fluid at a lower resolution than I used to compute the distribution of material moving through the fluid (shown in black and white). I used bilinear interpolation to smooth out most artifacts caused by this speedup - though you can still see some artifacts around the boundary of the obstacle. I ignored the viscous diffusion term from the Navier-Stokes formula to encourage better vortex formation (the implicit advection solving I'm using creates enough diffusion on its own for this system).

Click and drag to apply a force to the fluid:

To learn more about the math involved, check out the following sources:
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.

Written by Amanda Ghassaei as a homework assignment for The Nature of Mathematical Modeling, code on Github. If you like this, you might also check out my other Fluid Simulation app.

About

A realtime fluid flow simulation on the GPU using WebGL

Resources

Releases

No releases published

Packages

No packages published