Questions tagged [p5.js]

p5.js is a JavaScript library that starts with the original goal of processing, to make coding accessible for artists, designers, educators, and beginners, and reinterprets this for today’s web.

p5.js is a JavaScript library that starts with the original goal of processing, to make coding accessible for artists, designers, educators, and beginners, and reinterprets this for today’s web. p5.js has a full set of drawing functionality too.

See also:

3071 questions
1
vote
1 answer

P5.js mousePressed() function not working , and it is outside drawfunction

I don t understand why isn't working,I think is a problem with the draw and setup function.Here is the full code: function setup() { var height = 400; var length = 400; createCanvas(length,height); …
1
vote
1 answer

What am I doing wrong with this RGB to HSV colour conversion equation?

For a uni project I am making my own RGB to HSV colour converter. Here is the code I have written function calcSat() { s = (maxRGB() - minRGB()) / maxRGB(); if (isNaN(s)) { s = 0; } } function calcVal() { v = maxRGB(); } function…
Nic Hooper
  • 133
  • 7
1
vote
0 answers

p5.js slows down after too many sound effects

I have a simple game that creates lots of tiny sound effects. It works fine for the first 1 or 2 minutes, but starts rapidly slowing down and lagging soon after. It seems like my computer runs out of RAM? Disabling just the sound effects or simply…
p2r3
  • 11
  • 2
1
vote
1 answer

Sine function to vary object heights in P5.js

I have a sketch in P5.js that is close to working as intended, except that I can't figure out how to control the period or wavelength. As you'll see if you run the code, the animation creates long sweeping waves, but I'd like to be able to set the…
Chris Amato
  • 135
  • 1
  • 7
1
vote
1 answer

Save only a certain area of canvas using p5.js

I am wondering if it is possible to clip/save a specified area of the canvas to a local jpg/png file using P5.js. I'm aware of the save() function. However, as far as I know, it only saves the canvas as whole. Any ideas? Thanks!
1
vote
0 answers

How to create a sprite image button and add it to a 3D canvas?

Im working on a 3D Canvas using p5.js and three.js. My question is: How to set the image on the corner of the 3D canvas? Notice that when i work on the canvas i don't want the image to disappear but also not move, as I might rotate or move around in…
Loizos Vasileiou
  • 674
  • 10
  • 37
1
vote
2 answers

How do I save/store the output of the random function?

I'm coding a tree in different seasons (though the original code for the trunk and randomized branches is not my own). For winter, I want to keep the tree randomized, but also have animated snowflakes. However, each time the function that makes the…
Ian Rispin
  • 11
  • 1
1
vote
1 answer

Super keyword doesn't work with variables when trying to extend p5.js library

I want to extend the p5.js library in order to have error text on various locations on the screen. I will be using it in different places throughout my app and I believe it's better to do this than duplicating the code. For now, almost everything…
Dorinel Panaite
  • 492
  • 1
  • 6
  • 15
1
vote
1 answer

Issue using getters and setters in p5.js javascript class, "Script error. (: line 0)"

I have created a class which takes in an array of vector coordinates, and then sketches leafs where those coordinates are. I am writing a getter and a setter where you can change the colour of these leafs. The leaf colour rages from a minHue and a…
1
vote
1 answer

Conditional statement not activated for bouncing ball in p5.js

I'm completely new to JavaScript and p5.js. I know this is not the most efficient code for bouncing ball, but I tried to write my own bouncing ball mechanic as self-learning. function draw() { background (col); // background col = map(cir.x,…
KubiK888
  • 4,377
  • 14
  • 61
  • 115
1
vote
1 answer

P5.JS .show() is not a function, why?

Not sure if i'm getting the scope wrong but iv'e tried moving the function around a bit but it just gives me that is not a function error. let bubbles = []; function setup() { createCanvas(400, 400); for (let i = 0; i < 10; i++){ …
ZMan
  • 11
  • 2
1
vote
0 answers

All objects' properties modified instead of one in 2d array

I'm trying to recreate Tetris in P5.js. I want my shape that falls to pass on its coordinates once it has reached the bottom. I want to pass on the object x/y coordinates (translated into indexes) to my board Class' state named grid which is a 2d…
pyan
  • 865
  • 2
  • 12
  • 23
1
vote
1 answer

createImage() vs createImg() vs loadImage() in p5. which to use to load in an array of images for use in ml5?

I am attempting to piece together an example from ml5 on image style transfer (https://ml5js.org/docs/style-transfer-image-example) with p5.js examples parsing a JSON of image URLs, and adding them to an array to display as images. I am hitting a…
1
vote
1 answer

Percularities with p5 pixel fill

I'm using the p5.js library. I'm making a program that is meant to automatically fill closed spaces but I'm having a problem. Sometimes the program fills half closed loops and I can't figure out why. If anyone could help me identify the problem I…
1
vote
1 answer

Can Processing code in java run outside of the processing ide as a gui application?

I am talking about p5.js equivalent in java called Processing using which i can program a lot of graphical elements and it has event handling capabilities. I have written my java code inside the processin ide . But i want this to work as a…
Natesh bhat
  • 12,274
  • 10
  • 84
  • 125