3D SPLOM

Note that this example requires WebGL.

In my previous gist, I had stated how easy it would be to display 3 dimensional scatterplot matrices; simply a matter of framing the data a bit differently and plugging in a WebGL 3d Scatterplot.

After 4 days of working this "easy" problem, I have a working solution.

I had to modify the elegans library to be a bit more reusable and is included within this gist.

I also ran into issues with my original idea of showing all permutations of the iris dataset. This would have resulted in 64 3d models. Apparently 16 is the limit and my computer almost blew up trying to accomplish the original task.

So I framed the data via unique combinations instead and settled for 4 distinct 3d models.

Specific Points of Interest

Framing

The original data is stored in a csv structured like this

sepal_length,sepal_width,petal_length,petal_width,species
5.1,3.5,1.4,0.2,setosa
4.9,3,1.4,0.2,setosa
4.7,3.2,1.3,0.2,setosa
...

The following code creates frames based upon all the distinct combinations of 3 columns at a time (other than species which is left alone and passed as is for grouping, legends and series coloring).

var gi = dex.csv.getColumnNumber(iris, "species");
var frames = dex.csv.getCombinationFrames(iris, 3, gi);

Each frame is fed into its own independent 3-dimensional scatterplot and laid out in 3d space.

References

• dex.js The main site

forked from <a href='http://bl.ocks.org/PatMartin/'>PatMartin</a>'s block: <a href='http://bl.ocks.org/PatMartin/89cfed780156a1ddf5b1480067fe199a'>3D SPLOM</a>