p5.js library for rendering of platonic solids.
solid(args)
Where solid
can be one of the following functions: tetrahedron
, hexahedron
(or cube
), octahedron
, dodecahedron
, or icosahedron
, and args
are:
length
: Defines the length of the solid (default is100
).center
: A p5.Vector defining the location of the solid center (default is(0, 0, 0)
).colors
: An array containing the p5.Color elements used to color faces or vertices. If no colors are provided, style thesolid
using p5fill
,stroke
, etc.fuse
: A boolean. Iftrue
, defines per-vertex coloring (colors will fuse within faces); iffalse
, defines per-face coloring (faces will have uniform coloring). The default isfalse
.
All args
are optional and may be specified in any order. For example, calling in draw
:
function draw() {
dodecahedron(50, ['yellow', 'blue', 'red'])
}
would draw a dodecahedron with a length of 50
, with faces colored yellow
, blue
, and red
(non-fused colors).
There are two ways to define retained mode geometry of the solid
function with args
(refer to the previous section for solid
and args
) in setup
.
Call platonicGeometry(solid, args)
, for example:
let dodecahedronGeom
function setup() {
dodecahedronGeom = platonicGeometry(dodecahedron, 50,
['yellow', 'blue', 'red'])
}
Or call platonicGeometry(args)
to define a random Platonic solid.
Using beginGeometry and endGeometry. For example, the following snippet defines a retained mode dodecahedronGeom
:
let dodecahedronGeom
function setup() {
beginGeometry()
dodecahedron(50, ['yellow', 'blue', 'red']) // See the previous section for arguments
dodecahedronGeom = endGeometry()
dodecahedronGeom.clearColors() // Optional
dodecahedronGeom.computeNormals() // Optional
}
To render a retained-mode Platonic solid, call model. For example:
function draw() {
model(dodecahedronGeom)
}
Link the p5.platonic.js
library into your HTML file, after you have linked in p5.js. For example:
<!doctype html>
<html>
<head>
<script src="p5.js"></script>
<script src="p5.sound.js"></script>
<script src=https://cdn.jsdelivr.net/gh/VisualComputing/p5.platonic/p5.platonic.js></script>
<script src="sketch.js"></script>
</head>
<body>
</body>
</html>
to include its minified version use:
<script src=https://cdn.jsdelivr.net/gh/VisualComputing/p5.platonic/p5.platonic.min.js></script>
instead.
Clone the repo (git clone https://github.com/VisualComputing/p5.platonic
) and open it with your favorite editor.
Don't forget to check these p5.js references: