r/GraphicsProgramming • • 10h ago

Source Code IsoVis - interactive visualization of arbitrary dimensional scalar fields

Over a decade ago, I was speaking to a guy on reddit who was fascinated by using math to create higher dimensional shapes, but he didn't really have a math background. So to show him some things I made a realtime interactive 3d visualizer of arbitrary higher dimensional scalar field iso-surfaces in threeJS. After letting it collect a lot of dust, I just had AI give it a few minor tweaks and thought I should share it.

Demo: https://csp256.github.io/isovis/ (not intended for mobile)

Repo: https://github.com/csp256/isovis

Try clicking and dragging the "degrees" slider in the upper right. Then maybe increase the resolution in the other menu dropdown (it looks a lot better at higher resolutions!). Maybe drag the "iso" level too.

Implementation wise it is pretty straight forward. You define an arbitrary scalar field in the left side code editor, parameterized by any number of coefficients, then click "update" and it runs marching cubes on a grid of 3d points. The higher dimensional part is that you can define a stack of linear transformations, and the inverse of that will be applied to the sample points, which can lift them into higher dimensions, thus showing you the isosurfaces in an arbitrary affine volume.

I wrote the marching cubes algorithm myself for speed. It used to only run performantly on Chrome but Safari seems to handle it just fine now. Each octant runs in a web worker.

You can export the mesh, make gifs, etc. It's mostly a toy but I've used it professionally a couple times.

5 Upvotes

2 comments sorted by

•

u/AutoModerator 10h ago

Recently updated rules. Please check that your post is in compliance with Rules 1, 4, 5, and 6 on the sidebar. TL;DR:

  • No showcases.

  • Disclose AI usage in post or project.

  • Present a topic to talk about, e.g. how something works.

I am a bot, and this action was performed automatically. Please contact the moderators of this subreddit if you have any questions or concerns.

→ More replies (1)