Multiple p5 sketches on one page

p5.js Beginners
1

Hi, I’m trying to add multiple p5 sketches on one page. I’m trying to use the .parent(‘x’) function to put the canvases inside of their own divs, when I use one it shows up just fine, but when I include two, the other one disappears. Does anyone know why this is happening?

This is the set up I am using in p5 for each of the javascript files.

function setup() {
var canvas = createCanvas(windowWidth, windowHeight/2);
  canvas.parent('bubbles-holder');
}

this is what I include in the html file:

<div id="bubbles-holder"></div>
2

Unfortunately default mode (global) doesn’t work as two sketches’ namespace clash. You need to use instance mode

And if you have further questions please post your sketch so it’s easier to spot the issues!

3
1 Like