nth Dimention Cube Renderer
What is this ?
Rendering variations of the cube in multiple dimentions, using a custom high-perf vanilla-JS matrix library.
I tried my best to document the source code (src directory) as well a possible.
Link to the Daniel Shiffman's video that inspired me to do this: The Coding Train - Coding Challenge #113: 4D Hypercube.
Running this locally
Run this command in your desired folder (git required):
git clone https://github.com/ninivert/N-Dimension-Cube-Renderer.git
Or download it from the GitHub page directly.
docs\index.html in a modern browser (tested on Firefox, Chrome and Chrome mobile).
Development with node.js:
npm installto install the needed development dependencies.
npm run startand visit
localhost:8080in your browser.
npm run devto watch and compile changes you make automatically.
About the 10 dimensions limitation
The live demo renders up to 10 dimensions because of performance limitations (things get laggy with 1024 vertices on a
CanvasRenderingContext2D!), but there is no theoretical limitation to how far you can go. To render more than 10 dimensions, change the max clamp value in line 173 of
I could create an object pool for the matrices (JS memory heap graph is very spikey) but that would make the code a lot less readable, and the framerate hits 60 fps consistently on all tested devices for dimensions less than 6, so I'm not really bothered by it.