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
2 answers

How can I slow down the random generation rate?

I'm just starting to learn P5 & JavaScript, and I've managed to create a canvas that has random patterns generated onto it. However, it seems like everything is being generated with the same framerate, which is making some of the objects/shapes…
user2387766
1
vote
2 answers

Mouse Tracking in p5js

I want something to happen in p5js when the mouse is over a map of a country (which is not a standard shape). How can I do that? I mean how can I track a mouse on a non-standard shape like the map of a country? (I've loaded this shape as an image…
Ata
  • 19
  • 1
  • 7
1
vote
1 answer

p5.js sound: How to remove individual cues with removeCue()

The p5.js sound library documentation says that removeCue() can be used to cancel cued events. It says it takes an ID input that is returned from addCue(). When I invoke addCue and store the result to a variable it does not return an ID. It returns…
William
  • 4,422
  • 17
  • 55
  • 108
1
vote
1 answer

Line not drawing properly

so I was looking around for line algorithms, when I found Bresenham's Algorithm. I decided to make a code version of it, and for the most part, it worked. However, when I wanted to draw a square, I ran into a problem. It won't draw a certain line.…
1
vote
3 answers

TypeError: 'addNode' is not a function

I wrote a simple JavaScript p5 app (with p5.js) to create a BST data structure. When running this with Firefox, it's showing me TypeError: this.root.addNode is not a function Can anyone please help? This is the full code (error is in line 20) var…
Alexi
  • 21
  • 6
1
vote
1 answer

p5.js classes (class "example" is not changing my this.x value)

I want to move an ellipse but I am stuck because my this.x value isn't changing... print("hit this.y = 30"); is working just fine but this--; is not working. Is anything blocking it? Thank you in advance for your time! let redBubble = 0; let x =…
Simon Fredrich
  • 95
  • 1
  • 10
1
vote
1 answer

Is there a way to style p5js sliders using pure JavaScript and without HTML/CSS?

I have a few sliders in javascript (specifically using p5.js library) for which some styling needs to be added (add labels and do some colouring). Is it possible to do so in javascript, without using HTML and CSS?
Abby
  • 306
  • 3
  • 13
1
vote
1 answer

How to clear part of the buffered image with p5.js

I am using javascript with p5.js framework. I created an offscreen graphics buffer. Now I want to clear part of that buffer (so it becomes invisible again). What is the best way to do it? Right now I can only achieve that by direct changing of the…
mike239x
  • 205
  • 3
  • 11
1
vote
1 answer

How can I make a sprite unable to pass through lines?

So I've imported a maze image (png) as the background of my canvas, and drawn lines over the corresponding lines in the image in p5. I've created a sprite which is my 'character' and it's just a small image, and all it's doing at the moment is…
1
vote
1 answer

Fill a colour inside a shape

I plotted a circle with an algorithm using point() function to plot each points in the circular arc. Then I used line() function to make different lines joining the arc & the center. My goal is to display a pie chart with different colors in the…
Prabin
  • 33
  • 9
1
vote
2 answers

Rotating a 1d RGBA array

I'm working with a 1D pixel RGBA array that looks like this: pixelArray =[0,0,0,255,0,0,0,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255,255]; What this pixelArray corresponds to when drawn is 2 black pixels and 4 white…
Vigrant
  • 898
  • 1
  • 17
  • 27
1
vote
2 answers

Trying to retrieve an object's color from an array

So I've been at this for hours and my brain is fried so I could use a bit of assistance. I need to take the color value from the most recently added object in an array and use it for a separate function. In the comments it's objective #4. I…
D.Quinlan
  • 33
  • 4
1
vote
2 answers

How to save strings to SPECIFIC location in p5.js

Here I have a code that I was playing around with. It loads a string within my file and saves an unimportant one. var file = "1"; var result; var meString; var splitMeString; function preload() { result =…
user9773526
1
vote
1 answer

How do I redefine the origin of the window for createCanvas(window.innerWidth, window.innerHeight) in JavaScript (chrome web browser)?

I'm getting started on javascript using the p5.js library and I noticed this: canvas NOT positioned in top left corner When I create a canvas, it is at the origin in cartesian plane. But the origin is not at the top left corner of the window.…
1
vote
1 answer

Processing: Code stops working without making any changes to it

So I've run into this issue a few times using Processing (p5.js mode), where seemingly out of the blue it doesn't want to compile. The error reads: "SyntaxError: Expected ; but found [name of my first variable]" I can literally copy and paste the…
Anthony
  • 13
  • 3