Show HN: WebGL Fire Simulation • Hacker News Board

I seem to remember reading a tutorial about making this effect back in the 90s (it was a great series by someone called "Denthor", or something like that). The bottom part of the effect was supposed to be hidden, only showing the flames I think.

Re: Show HN: WebGL Fire Simulation

#24

Post by steaminghacker » Fri, Aug 19, 2016, 11:24 AM UTC

jharsman wrote: post #4

steaminghacker wrote: post #2

do you have a shadertoy version of this for comparison? i took this one by ozzy https://www.shadertoy.com/view/lsSGWw and tweaked a few things by hand for optimization. saved a few cycles on the code and increased the iterations to 13, which gives a better result. like this: #define ITERATIONS 13.0 #define SPEED 10.0 #define DISPLACEMENT 0.05 #define YOFFSET 0.1 #define YSCALE 0.25 #define FLAMETONE vec3(50.0, 5.0, 1…

I can't get your example code to work, but that is a completely different technique, ray marching a volume displaced by a noise function. This gives nice 3D-looking flames, but the movement tends to look like a scrolling noise function. And it's harder to use arbitrary burning shapes, my simulation supports drawing anything and it will burn.

Sorry, this version wont just paste back as is in shadertoy. Also it needs a random 256x256 bitmap in channel 0. The effect is the same as ozzy's original, except change ITERATIONS to 13 in his code to see the change (which is only slightly better). The other changes were for performance, which i improved slightly.

Re: Show HN: WebGL Fire Simulation

#25

Post by abritinthebay » Fri, Aug 19, 2016, 2:59 PM UTC

kbirk wrote: post #11

Nothing will ever impress me more than this WebGL fire / explosion effect: http://glslsandbox.com/e#33550.0 Warning: may melt your GPU.

Works surprisingly well on iOS actually! Not as good as desktop but the effect is impressive