nD Visulization

[max0410]

Looking into the code of this website I see it uses a 3d javascript library called X3D. The things they are showing are 3d projections of 4d objects. For example, are eyes can not see 3d, they see 2d. So, our life is a 2d projection of a 3d world. Pretty deep right. So for in order for the nD Visualization to work, we will have to take our nD data and project it on to a 3d canvas, most likely using p5js's tool for 3d objects. So we just have to figure out how to project nD objects to 3d. I have been researching on this.

2d projection of 0d hypercube

2d projection of 1d hypercube

2d projection of 2d hypercube

2d projection of 3d hypercube

2d projection of 4d hypercube

2d projection of 5d hypercube

3d projection of a 4d hypercube
http://codepen.io/max0410/pen/zNQQQM

[Smilebags]

Great work. Yes, projection matrices are what we will need for that. A projection matrix for 3>2 might look like this:
(x',y') = (x/z, y/z)
So, what we need to do is the same thing from 4 to 3. I think the best way to do this will to be first implement a matrix function which can take a nVector and another matrix argument, and return the resulting nVector. Are you familiar with matrices? If so would you like to start implementing a function for doing that?

Maybe we should define an nMatrix first, as a standard which we can always base the functions off. I'll work on that now.

[max0410]

Here is a crappy drawing of 4d cube

[Smilebags]

Yeah, that looks right. Well, it is a 2D projection of a 3D projection of a 4D cube.

[max0410]

I was just about to post a 2d projection of a 5d object
If we get the 2d projections down, then we ccan do the 3d ones

[Smilebags]

Yep. I just committed an initial idea for how to implement matrices, but not anywhere near complete.

[max0410]

5d projection
My brain hurts now

[max0410]

Ok, I'm going to figure out p5js's 3d stuff.

[Smilebags]

That would be great. There's quite a lot there.

[max0410]

Here is a 3d projection of a 4d wireframe. http://codepen.io/max0410/pen/xgNWjG

[max0410]

I used custom shapes so I could create just a wireframe, I am trying to find a way to just use box(), and then have translucent faces.

[Smilebags]

Translucency is pretty complex in simple engines like webGL, you can look it up but it might be difficult.

[Smilebags]

Nice work with your code, it looks good!

[max0410]

Thanks!

[max0410]

I created an adjustable 4d hypercube: http://codepen.io/max0410/pen/zNQQQM
Now I will use the hypercube4d() function to create a 5d hypercube!

[Smilebags]

Looks good! Check out my new example and see if you can extend it. :)