Metaballs and WebGL

Just as an aside, there's a much better way of doing metaballs in 2D but that can't be expanded to 3D: http://nullcandy.com/2d-metaballs-in-xna/

The basic idea is you draw a gaussian falloff sprite for each blob into a render target with additive blending, such that you get a density field from the sum of the falloffs. After that you do a simple threshold operation in the pixel shader and bam, very cheap unlimited metaballs. This is also the principle behind Smoothed Particle Hydrodynamics.

Metaballs are great! Here's demo I wrote a while back that does them, but in a slightly hacky way for performance reasons (and it performs pretty well!) http://codepen.io/thomcc/pen/vLzyPY

Basically, each "ball" is a 2d gradient texture, i render them all to a framebuffer, and then do a postprocessing pass which applies a threshold (not strictly binary so as to get some antialiasing) to the gradient, rendering the isosurface.

(And I also have a 3D pen, which does the more legit marching-cubes approach: http://codepen.io/thomcc/pen/NGmmPB )

Always great to see an introduction to WebGL that isn't just a tutorial on three.js. This is exactly the kind of guide I wish I had back when I was first learning about GL programming.

Yay, make sure you check out the marching squares tutorial too, that's the real deal.

Before realizing what I clicked, I really wished this was Meatballs and WebGL.

I love it. I have been going through the same thing, as I'm new to 3D. Learning the pipeline, and trying to figure out all the options we have out there for WebGL. I ended up going with option #3, but due to the massive amount of data in my array i ran into performance issues when generating the initial array. I was able to split the original arrays ArrayBuffer into smaller ones, and send them to web workers (transferable objects :D) then concatenate the buffers at the end. I'll try to write an article as well, its amazing how much performance you can squeeze out of WebGL by doing your animation inside of your shader.

Please do a write up on the RTT/Render to texture approach you mentioned ;)