p5 #

p5 helps add p5 sketches into your book. There are two types of p5 shortcodes according to the html element used to embed them.

Types #

Iframe

p5 iframe shortcodes embed p5.js code within an iframe element. There are two p5 iframe shortcodes: p5-iframe and p5-global-iframe. p5-iframe # {{< p5-iframe ver="1.8.0" sketch="/path/to/sketch.js" lib1="https://cdntolib1/lib1.js" width="800" height="600" >}} All parameters are optional but sketch. Default values are shown in the above snippet but for libs*. Up to lib5 libs may be specified. Color relativity # Look at this brief explanation about what color relativity is. p5-iframe markdown {{< p5-iframe sketch="/showcase/sketches/colors.

Div

p5 div shortcodes embed p5.js code within a div element. There are two p5 div shortcodes: p5-div and p5-instance-div. p5-div # {{< p5-div ver="1.8.0" sketch="/path/to/sketch.js" lib1="https://cdntolib1/lib1.js" >}} All parameters are optional but sketch. Default values are shown in the above snippet but for libs*. Up to lib5 libs may be specified. Scintillating grid # Look at this and also this among many more references there are. p5-div markdown {{< p5-div sketch="/showcase/sketches/scintillating.