Volume Rendering with WebGL

willusher.io

95 points·ArtWomb··8 comments

This GPU Gems article is a good overview of GPU volume rendering as well (http://developer.download.nvidia.com/books/HTML/gpugems/gpug...). Raymarching in the fragment shader is probably better on modern hardware than the approach outlined in GPU Gems but it's still worth a read.

Hey this is super interesting to see, thanks for sharing!

That aneurysm model looks really cool with this technique - https://www.willusher.io/webgl-volume-raycaster/#Aneurysm

Don't zoom into the Boston Teapot!

Ha! I just stumbled upon that myself then came back here to comment and spotted yours!

This can also be done in a Jupyter notebook, I'm using this for scientific visualization of 'stuff': https://github.com/maartenbreddels/ipyvolume

You should probably use mipmaps to avoid aliasing when rendering from far away.

I guess you'll have to compute the LOD by hand since neighbor fragments are not necessarily performing the same texture fetches.

That works fine as long as there's no physically-based emission (say based off temperature or heat blackbody). Averaging (filtering) temperature values will give you slightly incorrect results at the edges. For WebGL stuff, that's probably not a problem, but it shows up in production offline rendering and needs to be dealt with differently.

The foot example with Samsel Linear YGB is simply amazing!

Reply on news.ycombinator.com