Hyperbook Documentation

P5

This element allows you to create and run p5.js sketches in your book. The p5.js library is a JavaScript library that allows you to create graphics and animations in the browser.

You can either load a p5.js sketch from a file or write it directly in the book.

You can also use the editor option to display an editor for the sketch.

For changing the height, you can use the height option.

::p5{src="p5test.js"}
 
 
:::p5{height=400 editor=true}
 
```js
function setup() {
    createCanvas(400, 400);
}
 
function draw() {
    background(220);
    ellipse(200, 200, 100, 100);
}
```
 
:::
 
function setup() { createCanvas(400, 400); } function draw() { background(220); ellipse(200, 200, 100, 100); }
P5
✎ GitHub© Copyright 2025 by OpenPatch