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

How to check the client browser performance with JavaScript?

I'm building a website and in one part of the website, there is a canvas. Every time I scroll at that viewport, the browser gets laggy. I want to check the browser performance, for example, an "FPS" and with JavaScript make a function with a…
Bryan Enid
  • 414
  • 3
  • 12
1
vote
2 answers

creating squares through points stored in an array, p5.js

So, after the user has created a square, i want to create small squares within that big square, for every line, i am running a loop where loop starts at point 0 and goes till point 1 , The problem i am facing right now is that, when the loop has…
SilentHG
  • 109
  • 1
  • 12
1
vote
1 answer

How can I reset the deltaTime in my p5js sketch to restart the sketch?

I want to reset my p5.js sketch. The current way resets my gamestate, but not the deltaTime. The problem is, that I calculate my movement by a factor of the deltaTime. This means if I reset my gameState and call the noLoop function the deltaTime…
1
vote
1 answer

JavaScript Objects not instantiating

I have a class dynObj, but it appears that seperate instances of it adopt the values of the most recently defined instance. draw() { tmov1 = new dynObj(args...); //Displays as a white ball on webpage, as intended tmov2 = new dynObj(different…
1
vote
1 answer

How to compare all elements of an array(list) (of objects) with each other in javascript (p5.js)

Actually I use p5.js, but I suppose the js built in functions should also work in the same way as in javascript. Given is a list of dynamically generated objects stored in an array. The objects have coordinates (x,y), size, and some other…
1
vote
1 answer

continues dragging background on mouse

I try to make infinite background dragging on mouseDragg but I stuck. I want background when disappears left appear right and opposite way. I try various solutions but nothing seems to work. var StageStart = 0; var StageEnd = 200; var x1 =…
Michael
  • 168
  • 2
  • 18
1
vote
1 answer

How can I run my function only after a key is pressed?

I want to run the startDraw() function when I press a key, and have it run constantly after the key is pressed. I tried to use the if(mouseIsPressed) statement, and the mousePressed() function that is predefined in p5.js, however it only runs the…
Mr.Ulis
  • 157
  • 6
1
vote
2 answers

passing data from controller to javascript in .Net Core

I want to pass data from controller to javascript file. Here is my model Field [Key] public int id_field { get; set; } public string name { get; set; public int field_type { get; set; } This is my GameModel public…
Bart
  • 41
  • 7
1
vote
1 answer

Add event listeners to pixels in HTML Canvas Element

I have an HTML Canvas that's 500 x 500 pixels (250000 pixels total). I'm using P5 javascript library to make some designs on the canvas. I want to: 1) Attach an ID to each pixel 2) Every time a pixel changes, I want an event to pick up that gives…
a94
  • 564
  • 1
  • 7
  • 16
1
vote
0 answers

Is it possible to extract audio from soundcloud-widget

I have a p5 canvas that makes visuals accords to the song it plays. I try to add SoundCloud-widget as another music resource for user (and not just local uploading). Are there is a way to extract the audio/blob/m3u8 from the widget? just set the…
Hagai Harari
  • 2,767
  • 3
  • 11
  • 23
1
vote
1 answer

How to load image and make it as background in p5.js

I just want to ask a simple question, how do I load an image and make it as a background in my html5 canvas var bg; function setup() { createCanvas(600,400) bg = loadImage("https://mcdn.wallpapersafari.com/medium/1/92/T1iecJ.jpg") } function…
1
vote
1 answer

around its central point

My problem is as follows. I would like to rotate the grid around its central point but so far i can rotate it around the central point of the canvas. I've tried various settings but none of them brings the desired result. So far, I only manage to…
Michael
  • 168
  • 2
  • 18
1
vote
1 answer

Change image on button click in p5.js

I have 2 dimensional array filled with cells. i want this cell to update image on button press. I want to pass the value to the constructor but something goes wrong and its nowt working.my thought was to pass to constructor image value this.img =…
Michael
  • 168
  • 2
  • 18
1
vote
1 answer

I have seen a lot of people use I in their code and I am not sure how nor when to use it. If anyone can please explain it, that would be appreciated

I just started using processing, and coding in general so I have no idea what anything stands for. However, I always see people using "i" in their codes, I don't really know what it stands for, so please how and when can I use "i"? I tried searching…
sali khzuz
  • 11
  • 1
1
vote
2 answers

Issues with mousePressed in p5js

I am trying to build a simple app that plays a song when you press/click on the screen. Once you press/click a ripple effect will happen as well making a visual aspect to it. The ripple should happen every time you press/click but in my code…
eddiepearson
  • 31
  • 1
  • 7