Volume rendering 3D data in Three.js and GLSL
I've been going through Cem Yuksel's "Introduction to Computer Graphics" course and thought that writing a volume renderer would be a good way to test my knowledge. It is a common technique used to render 3D medical data. Works by ray marching a specific step size, reading a 3D texture (e.g. MRI data), and calculating opacity values. Code should be easy to get started with for anyone familiar with the JS ecosystem. Questions for the HN community: I spent 20-25% of the entire time just setting up the project and fighting issues with the JavaScript ecosystem. This experience has made me…
Volume rendering 3D data in Three.js and GLSL launched on April 21, 2024 with 108 votes, #503 of 4,347 launches that month and more than 90% of that year's launches. The site was still online in September 2026, 2 years on.
In plain words
This is a volume renderer built with Three.js and GLSL that displays 3D medical data like MRI scans using ray marching techniques. It's designed for developers familiar with JavaScript who want to learn graphics programming or render volumetric medical imaging data. The implementation prioritizes ease of use within the JS ecosystem and demonstrates core concepts from computer graphics education through accessible code examples.
written from the facts on this page · September 2026
From the sources
🌊 The code for my volume rendering implementation in Three.js and GLSL. - SuboptimalEng/volume-rendering
In the maker’s words, at launch
I've been going through Cem Yuksel's "Introduction to Computer Graphics" course and thought that writing a volume renderer would be a good way to test my knowledge. It is a common technique used to render 3D medical data. Works by ray marching a specific step size, reading a 3D texture (e.g. MRI data), and…
Does a similar job
all alternatives →
Spark, An advanced 3D Gaussian Splatting renderer for Three.js2025 · sparkjs.dev · ▲377I'm the co-creator and maintainer of https://aframe.io/ and long time Web 3D graphics dev. Super excited about new techniques to author / render / represent 3D. Spark is a an open source library to easily integrate Gaussian splats in your THREE.js scene I worked with some friends and I hope you find useful. Looking forward to hearing what features / rendering techniques you would love to see next.
An ASCII 3D Rendering EngineJun 2026 · glyphcss.com · ▲211Render 3D models (OBJ, glTF, GLB, STL, .vox) as ASCII art — in the browser, in React or Vue, or straight in your terminal. A three.js-style API with no WebGL and no canvas: just text in a single <pre>.
A gallery of graphs built with React and D3.js2023 · react-graph-gallery.com · ▲297Many JS libraries exist to build graphs on the web (Vega, chartJS, Plotly...). They allow to make charts quickly. But you lose flexibility: you're limited by the options they offer. I just created a gallery with hundreds of graphs made with d3.js and React. - Examples are split by graph types - They all come with explanation and code sandboxes - Gradual complexity to ease the learning curve It took me ages to create this project! Feedback welcome!
- 3R3D Raycasting Engine in JavaScript2020 · ahuth.github.io · ▲113
Procedural-gl – open-source 3D mapping library built with Three.js2020 · github.com · ▲29Mobile-first 3D mapping engine with emphasis on user experience - felixpalmer/procedural-gl-js
A JavaScript library for data visualization in both SVG and Canvas2024 · github.com · ▲161Here's a project I've been working on for a little while now. Ripl is a JS library that provides a unified API for rendering shapes on both canvas and SVG interchangeably. Over the years I've used D3 extensively to create data visualisations so I figured I'd have a go at making my own version with a slightly more modern API and stricter TypeScript support. I am aware there are already libraries that can draw to multiple contexts interchangeably, but I've added a few little niceties to Ripl that (as far as I know) some other libraries don't have such as CSS-like query selectors, DOM-like…
More dev tools this month
the category →
open-source IDE for thoughtful software design. Contribute to devdotfast/whiteboard development by creating an account on GitHub.
Dev tools · 27d ago · github.com
Contribute to reladraw/reladraw development by creating an account on GitHub.
Dev tools · 25d ago · github.com
OpenBot▲362Grok Bot alternative: free, local, open-source, multiplayer
Dev tools · 22d ago · openbot.run
Talanoa▲340Hi HN, I’m a fullstack developer, and honestly, I’ve lost count of how many side projects I’ve worked on over the years. But one idea kept coming back to me: a different kind of email client. It first came to me in 2014: “What if we could handle emails more like conversations?” Every year, I’d revisit this concept in my “Build Notes.” Ten years later, no one had built exactly what I had in mind — so I finally decided to do it myself. That’s how Talanoa was born. I wanted something focused on people, not timelines. I was tired of marking messages as unread just to remember to reply later, or…
Dev tools · 20d ago · talanoa.email
CoreSpeed▲332One MCP for everything your agents need: apps, memory, tools
Dev tools · 27d ago · corespeed.io
Source: Show HN post ↗ · launch text quoted in part
Launched alongside, April 2024
the whole month →
Supabase▲2,325The Postgres developer platform is now generally available
Dev tools · 2024 · supabase.com
Cal.com Platform▲1,601Build your pixel-perfect booking experience with Atoms
Dev tools · 2024 · cal.com
deco.cx 2.0▲1,078Build web apps 10x faster with Deno, JSX, TS & Tailwind
Dev tools · 2024 · decocms.com
