Preload elements in P5.js

I have a JSON file that contains the names of the image files to be load. { "images": ["1.jpg", "2.jpg", "3.jpg"] } I use the preload() function to load the content of the JSON file using loadJSON() The problem is that loadJSON is asynchronous, so the information is not available immediately. When setup starts I… Read More Preload elements in P5.js

text displayed twice

When I try to add text to p5.js canvas, it got displayed twice for some reason. Attached code below: let img; function setup() { createCanvas(screen.availWidth, screen.availHeight); img = loadImage(‘https://mediumpurpleperfumeddegrees.boyuan12.repl.co/circuit1.webp’); textOutput(); } function draw() { image(img, screen.availWidth / 2 – img.width, 0, img.width * 1.25, img.height * 1.25); textSize(20); text(‘5V’, screen.availWidth / 2 – img.width -… Read More text displayed twice

Loop an animation that uses p5 draw function

I was wondering, how can I loop functions in JavaScript? For example, I have that code here: function setup() { createCanvas(500, 400); frameRate (50) } function draw() { background(220); fill (250,250, 250); ellipse (frameCount, 200, 50); ellipse (frameCount, 220, 50); ellipse (frameCount + 180, 215, 50); ellipse (frameCount + 180, 230, 50); fill (250,0, 0);… Read More Loop an animation that uses p5 draw function

"UPDATE" could not be called as a function

this is the update function this.UPDATE = function() { this.vel.add(this.acc); this.pos.add(this.vel); this.acc.mult(0); } this is where it is called function draw() { background(0); rocket.UPDATE(); rocket.render(); } the error in the non-p5.js console says that UPDATE is not a function this is the whole code function Rocket() { this.pos = createVector(width/2, height); this.vel = createVector(0, -1);… Read More "UPDATE" could not be called as a function

How to make an image disappear by assigning 'undefined' to an array entry without affecting other entries?

I’m having problems making an image disappear after clicking on it by assigning ‘undefined’ to that array entry, but I don’t know how to keep rewriting the other objects while letting the draw function of p5.js extension run through the undefined entry. function preload() { images[0] = loadImage("W5 T1 p1.png"); images[1] = loadImage("W5 T1 p2.png");… Read More How to make an image disappear by assigning 'undefined' to an array entry without affecting other entries?

p5(python port) – TypeError: 'int' object is not callable without Python keywords in variable names

I’m new to coding, it’s been a long time since I last coded, I did it all of a sudden because of a school assignment. I know my coding is a terrible code covered in ‘global’, but I’m too noob to fix it, so I gave up. I’m only going to use this as a… Read More p5(python port) – TypeError: 'int' object is not callable without Python keywords in variable names

if something == something show something and keep showing it

so when this is true i want to keep the images even when this turns false later if (pose && label=="HowMuchCanYouSee"==true){ let eyeR = pose.rightEye; let eyeL = pose.leftEye; let d = dist(eyeR.x, eyeR.y,eyeL.x, eyeL.y); //sharingan complete image(img1,pose.leftEye.x-d/2,pose.leftEye.y-d/2, d,d); image(img1,pose.rightEye.x-d/2,pose.rightEye.y-d/2, d,d); } >Solution : I don’t understand why the condition looks like this label=="HowMuchCanYouSee"==true and… Read More if something == something show something and keep showing it

Function can't be displayed in second canvas within p5.js

I created two separate canvases with p5.js by creating a new instance (see line 58 in my javascript file). Then I inserted a function called "firstAnimation" that will be displayed in one of the canvases. Run the code here –> https://editor.p5js.org/MaximilianFreitag/sketches/fP46XAHnP In line 45 of my javascript file p5.js is telling me that my function… Read More Function can't be displayed in second canvas within p5.js