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 vertex shape line break

I'm working on a music visualization and draw a curveVertex based on the songs amplitude. Therefore I'm using the p5.js sound library. When the vertex hits the right end of the canvas, I want to force a line break but keep the lines above as single…
iamrobin.
  • 1,554
  • 3
  • 19
  • 31
1
vote
1 answer

How to make slider from p5 work with webpack?

I am using p5.js library with webpack and it works just fine. However when I try to import createSlider from p5.dom it fails import p5 from "./p5"; import * as dom from './addons/p5.dom' import {createSlider} from './addons/p5.dom' const s = (p)…
Philipp Chapkovski
  • 1,949
  • 3
  • 22
  • 43
1
vote
1 answer

How can we set different `colors` for different objects detected using YOLO

How can we set different colors for different objects detected using YOLO. Now everything detected are displaying in green rectangle. function draw() { image(video, 0, 0, width, height); // Displaying image on a canvas for (let i = 0; i <…
soccerway
  • 10,371
  • 19
  • 67
  • 132
1
vote
0 answers

Is there some kind of VBO/VAO in Canvas 2D or p5.js?

I'm working on a project which uses the marching squares algorithm. It outputs many polygons and this causes a performance drop when I draw it via the conventional p5.js way. I know from OpenGL and WebGL that there is VBO/VAO which let you draw much…
Panakotta00
  • 135
  • 9
1
vote
2 answers

How to check if two user-drawn (squiggly) lines intersect?

I'm thinking of making an online version of the game Sprouts, possibly using the JavaScript web browser graphics library p5.js You can read more about it but basically there are 2 players that draw lines with their mouse between points. The lines…
user10408316
1
vote
0 answers

How to isolate/encapsulate a function so that only arguments and variables made within the function were accessible

I cannot figure out how to isolate/encapsulate a function so that only arguments and variables made within the function were accessible. For example if I had: let greeting = "hello there"; function sayStuff(){ …
Vadim Kim
  • 129
  • 12
1
vote
0 answers

p5.js Sound custom wave form

A while ago, a friend of mine and I wrote a little command line program in python which can take .csv data as an input and create sounds. We recently discovered p5.js Sound and tone.js and were amazed by its capabilities. I'm especially in favour of…
Moglash
  • 259
  • 1
  • 5
  • 23
1
vote
1 answer

How to get chrome to use more CPU power

I made a NeroEvolution based AI that plays snake in p5.js, and in order to try and speed up the training I am trying to get many game cycles per frame, but chrome can't keep up. Is there any way I can allow chrome to use more CPU horsepower? Or is…
1
vote
1 answer

p5.js Safari play() pause() jump() problem

I am trying to make an audioplayer using the p5.js Javascript Library and Soundcloud API. Most of it works well, but I am encountering some minor problems in the Safari Browser. This is the website and the javascript file with all the functions is…
Joep
  • 112
  • 2
  • 10
1
vote
2 answers

How do I restrain the missile barrel between a minimum and maximum angle?

I'm trying to recreate Astro-Smash from the Intellivision and I want to make the barrel stay between two angles. I just can't figure out where and how to make the thing stay in between. I have swapped the function around every which way, trying to…
1
vote
1 answer

p5.js How do I let a Line go endless in both directions

I wanna let a line in P5.js go endless/ 100/200 Pixels in both directions and let it cut two points I know line() but it only goes from one point two the other and stops there
MrMugame
  • 15
  • 4
1
vote
2 answers

How would I get preload to be called after my button listener has been clicked?

I have an html5 application that I have been working on. In the app, I want the j5 audio library to run AFTER the user has uploaded a file from their computer (because I want to use it to visualize the amplitudes on a canvas). However, I am…
Jackson Ennis
  • 315
  • 2
  • 10
1
vote
0 answers

How can i color or texture each faces of a loaded .obj file?

I'm doing a 3D object texturing and coloring website. (For example a kitchen set. I want to change color or texture the kitchen cupboards, marble and fridge.) I'm loading the 3d kitchen set model on website. Customer should be able to see in any…
1
vote
4 answers

How does the setup() function in p5.js work?

In my HTML code I have Click me! Once "Click me!" is clicked, my_function() is called and in that program, I also have the setup() function. What is the execution order once my_function() is…
Kibae
  • 41
  • 4
1
vote
1 answer

model.fit() never ends or shows me the loss

I'm trying to train a model and never pass the fit(). In the console doesn't show the loss result, it gets stuck there. Already changed the async to a promise, but it's the same. To see the entire code, click here! function train() { …
Dinda
  • 11
  • 1