# p5.js

**URL:** https://discourse.processing.org/c/p5js/10.md?page=39

[Latest](https://discourse.processing.org/latest.md) · [Categories](https://discourse.processing.org/categories.md) · [Tags](https://discourse.processing.org/tags.md)

**Page:** 40

---

## [Beat Detection Algorithm help / feedback](https://discourse.processing.org/t/beat-detection-algorithm-help-feedback/31588)

<div class="topic-metadata">

**Author:** [@atagger](https://discourse.processing.org/u/atagger)\
**Replies:** 2\
**Last updated:** [August 6, 2021, 9:42pm UTC](https://discourse.processing.org/t/beat-detection-algorithm-help-feedback/31588 "2021-08-06T21:42:40Z")

</div>

I am trying to recreate an algorithm from this link - specifically the one for frequency selected sound energy: Frequency selected sound energy In the author’s work he uses a constant C set to 250. This constant does n…

---

## [Reading pixels from an image](https://discourse.processing.org/t/reading-pixels-from-an-image/31592)

<div class="topic-metadata">

**Author:** [@Kiliad](https://discourse.processing.org/u/Kiliad)\
**Replies:** 32\
**Last updated:** [August 9, 2021, 10:58am UTC](https://discourse.processing.org/t/reading-pixels-from-an-image/31592 "2021-08-09T10:58:05Z")

</div>

Hi. I’m having a problem with what I thought would be a a very simple piece of code. There’s not much point posting any of my attempts as I’m confused enough as is. Ultimately I have something more complex in mind, bu…

---

## [Uploading jpeg files= removed add file feature](https://discourse.processing.org/t/uploading-jpeg-files-removed-add-file-feature/31618)

<div class="topic-metadata">

**Author:** [@gregts13](https://discourse.processing.org/u/gregts13)\
**Replies:** 2\
**Last updated:** [August 8, 2021, 12:39am UTC](https://discourse.processing.org/t/uploading-jpeg-files-removed-add-file-feature/31618 "2021-08-08T00:39:09Z")

</div>

as you can see someone has removed the browse the computer for files to upload on the add files I wanted to upload a few pictures to an existing p5.js sketch, but can’t as the feature is gone what do I do now??

---

## [Unable to perform CSS image-rendering on p5 canvas in the browser](https://discourse.processing.org/t/unable-to-perform-css-image-rendering-on-p5-canvas-in-the-browser/31600)

<div class="topic-metadata">

**Author:** [@willyfly](https://discourse.processing.org/u/willyfly)\
**Replies:** 4\
**Last updated:** [August 7, 2021, 10:12am UTC](https://discourse.processing.org/t/unable-to-perform-css-image-rendering-on-p5-canvas-in-the-browser/31600 "2021-08-07T10:12:43Z")

</div>

First, sorry for my English and I’ll try to explain. I’m trying to display pixelated image on p5 canvas in the browser by providing the canvas element in style.css with image-rendering property. I found code below by Be…

---

## [Try to access parseObj(model,strings) in P5 code](https://discourse.processing.org/t/try-to-access-parseobj-model-strings-in-p5-code/31593)

<div class="topic-metadata">

**Author:** [@pirela](https://discourse.processing.org/u/pirela)\
**Replies:** 2\
**Last updated:** [August 6, 2021, 8:34pm UTC](https://discourse.processing.org/t/try-to-access-parseobj-model-strings-in-p5-code/31593 "2021-08-06T20:34:23Z")

</div>

I create obj data on the fly and want to use it directly without going through a file. loadModel( model, fileName) uses a file, but internally it uses the function : (line 100206 of p5.js) : function parseObj(model, …

---

## [Help - push an array into array simple question](https://discourse.processing.org/t/help-push-an-array-into-array-simple-question/31577)

<div class="topic-metadata">

**Author:** [@atagger](https://discourse.processing.org/u/atagger)\
**Replies:** 12\
**Last updated:** [August 6, 2021, 12:34am UTC](https://discourse.processing.org/t/help-push-an-array-into-array-simple-question/31577 "2021-08-06T00:34:10Z")

</div>

I’m racking my head not understanding why this doesn’t work. i was expecting the sampleBuffer array to become a length 32 array containing 32 arrays each with 3 random numbers. Instead I get a length 32 array of 32 arra…

---

## [How to draw with coordinates from face-api.js?](https://discourse.processing.org/t/how-to-draw-with-coordinates-from-face-api-js/31562)

<div class="topic-metadata">

**Author:** [@hermitcrab](https://discourse.processing.org/u/hermitcrab)\
**Replies:** 3\
**Last updated:** [August 5, 2021, 9:15pm UTC](https://discourse.processing.org/t/how-to-draw-with-coordinates-from-face-api-js/31562 "2021-08-05T21:15:56Z")

</div>

I have this code from GitHub - WebDevSimplified/Face-Detection-JavaScript, using face-api.js. const video = document.getElementById('video') Promise.all(\[ faceapi.nets.tinyFaceDetector.loadFromUri('/models'), facea…

---

## [Beginner question/s for a simple project](https://discourse.processing.org/t/beginner-question-s-for-a-simple-project/31570)

<div class="topic-metadata">

**Author:** [@sloppy](https://discourse.processing.org/u/sloppy)\
**Replies:** 4\
**Last updated:** [August 5, 2021, 8:52am UTC](https://discourse.processing.org/t/beginner-question-s-for-a-simple-project/31570 "2021-08-05T08:52:59Z")

</div>

Hi everyone, I’ve just started learning P5 and have just made an simplistic randomized program. I’m looking to make it a touch more complex but the 3 things I want to do, I don’t even have the coding vocabulary/thought…

---

## [Calculating the displacement of keypoints in pixels](https://discourse.processing.org/t/calculating-the-displacement-of-keypoints-in-pixels/31430)

<div class="topic-metadata">

**Author:** [@Timo](https://discourse.processing.org/u/Timo)\
**Replies:** 3\
**Last updated:** [July 31, 2021, 8:51pm UTC](https://discourse.processing.org/t/calculating-the-displacement-of-keypoints-in-pixels/31430 "2021-07-31T20:51:26Z")

</div>

Hi , I am exploring then ml5 and posenet . I am having some issues in calculating the displacement of keypoints ( nose , in my case) . I can get the keypoints logged out but my logic on calculating the displacement of n…

---

## [Sound.stop() not returning 0 on sound.currentTime()](https://discourse.processing.org/t/sound-stop-not-returning-0-on-sound-currenttime/31456)

<div class="topic-metadata">

**Author:** [@atagger](https://discourse.processing.org/u/atagger)\
**Replies:** 2\
**Last updated:** [July 29, 2021, 9:12pm UTC](https://discourse.processing.org/t/sound-stop-not-returning-0-on-sound-currenttime/31456 "2021-07-29T21:12:28Z")

</div>

I think there is something wrong / buggy in p5 sound. When you hit stop it should return zero for currentTime(), unless I am misunderstanding the intended behavior. I’m trying to change the sound playing using an array, …

---

## [Video.play().time(x) not working in chrome](https://discourse.processing.org/t/video-play-time-x-not-working-in-chrome/31485)

<div class="topic-metadata">

**Author:** [@atagger](https://discourse.processing.org/u/atagger)\
**Replies:** 0\
**Last updated:** [July 29, 2021, 4:21pm UTC](https://discourse.processing.org/t/video-play-time-x-not-working-in-chrome/31485 "2021-07-29T16:21:42Z")

</div>

For some reason the .time() will not work in p5. I’m only using createVideo in preload. I believe this is a chrome issue with local environments. Does anyone know a workaround? It jumps right back to the first frame n…

---

## [Create very few particles on a particle system](https://discourse.processing.org/t/create-very-few-particles-on-a-particle-system/31478)

<div class="topic-metadata">

**Author:** [@avivtech](https://discourse.processing.org/u/avivtech)\
**Replies:** 3\
**Last updated:** [July 29, 2021, 9:39am UTC](https://discourse.processing.org/t/create-very-few-particles-on-a-particle-system/31478 "2021-07-29T09:39:22Z")

</div>

Hi, I am trying to create bubbles simulation. I want a bubble to appear every 1-2 sec. and to burst at the bottom of the canvas. I have this so far: https://codepen.io/Avivtech/pen/yLbKooV I can not get to create only…

---

## [3D Lighting problems with Custom Shapes](https://discourse.processing.org/t/3d-lighting-problems-with-custom-shapes/31466)

<div class="topic-metadata">

**Author:** [@Sayochi](https://discourse.processing.org/u/Sayochi)\
**Replies:** 7\
**Last updated:** [July 28, 2021, 10:06am UTC](https://discourse.processing.org/t/3d-lighting-problems-with-custom-shapes/31466 "2021-07-28T10:06:04Z")

</div>

Im trying to convert my 2d terrain generator to 3d. i learnt about beginShape also works in 3d. watched few tutorials. but i have this lighting problem with my overall shape. i even tried to construct every individual tr…

---

## [Wait or delay into Loop](https://discourse.processing.org/t/wait-or-delay-into-loop/31468)

<div class="topic-metadata">

**Author:** [@Eddie\_float](https://discourse.processing.org/u/Eddie_float)\
**Replies:** 2\
**Last updated:** [July 27, 2021, 10:11pm UTC](https://discourse.processing.org/t/wait-or-delay-into-loop/31468 "2021-07-27T22:11:39Z")

</div>

I want to create a pause, wait or delay inside the loops. Is this possible?

---

## [Determining the correct detailX & detailY value for p5.Geometry](https://discourse.processing.org/t/determining-the-correct-detailx-detaily-value-for-p5-geometry/31464)

<div class="topic-metadata">

**Author:** [@hardwhere](https://discourse.processing.org/u/hardwhere)\
**Replies:** 0\
**Last updated:** [July 27, 2021, 5:11pm UTC](https://discourse.processing.org/t/determining-the-correct-detailx-detaily-value-for-p5-geometry/31464 "2021-07-27T17:11:14Z")

</div>

I’m generating geometry using p5.Geometry, but having trouble determining what the correct detailX and detailY values to use are. According to the comments in the source code, detailX is the “number of vertices on horizo…

---

## [Reporting documentation bugs](https://discourse.processing.org/t/reporting-documentation-bugs/30702)

<div class="topic-metadata">

**Author:** [@soegaard](https://discourse.processing.org/u/soegaard)\
**Replies:** 4\
**Last updated:** [July 27, 2021, 4:21pm UTC](https://discourse.processing.org/t/reporting-documentation-bugs/30702 "2021-07-27T16:21:15Z")

</div>

Hi All, In the past week I have reported a few bugs in the reference documentation of Processing. I have done this at https://github.com/processing/processing-docs/issues Today, I noticed that the latest response to …

---

## [Line Drawings with p5.Geometry](https://discourse.processing.org/t/line-drawings-with-p5-geometry/30953)

<div class="topic-metadata">

**Author:** [@hardwhere](https://discourse.processing.org/u/hardwhere)\
**Replies:** 2\
**Last updated:** [July 27, 2021, 3:59pm UTC](https://discourse.processing.org/t/line-drawings-with-p5-geometry/30953 "2021-07-27T15:59:54Z")

</div>

Hello! I was recently able to get help on a question with p5.Geometry (here) and am back with another question: Is it possible to use p5.Geometry to make a line drawing? In immediate mode, we can pass a parameter to beg…

---

## [Thin lines look different in Safari?](https://discourse.processing.org/t/thin-lines-look-different-in-safari/31460)

<div class="topic-metadata">

**Author:** [@astrom.hjalmar](https://discourse.processing.org/u/astrom.hjalmar)\
**Replies:** 1\
**Last updated:** [July 27, 2021, 3:14pm UTC](https://discourse.processing.org/t/thin-lines-look-different-in-safari/31460 "2021-07-27T15:14:19Z")

</div>

Hi all, I was hoping to get some help with this as I’m really stumped. When I draw thin lines (stroke weight \< 1) in p5js it looks a lot brighter in Safari compared to Chrome (example sketch). Has anyone else found a wa…

---

## [How to smoothly fading between multiple shaders with p5.js?](https://discourse.processing.org/t/how-to-smoothly-fading-between-multiple-shaders-with-p5-js/22645)

<div class="topic-metadata">

**Author:** [@Spenc](https://discourse.processing.org/u/Spenc)\
**Replies:** 1\
**Last updated:** [July 27, 2021, 8:44am UTC](https://discourse.processing.org/t/how-to-smoothly-fading-between-multiple-shaders-with-p5-js/22645 "2021-07-27T08:44:18Z")

</div>

I am trying to figure out how to fade between an array of shaders at random rates and random opacities. I tried creating an if statement that would provide a new target opacity and target rate of time it would take to fu…

---

## [P5js instance mode - how to manage functions?](https://discourse.processing.org/t/p5js-instance-mode-how-to-manage-functions/25369)

<div class="topic-metadata">

**Author:** [@amygoodchild](https://discourse.processing.org/u/amygoodchild)\
**Replies:** 4\
**Last updated:** [July 23, 2021, 9:00pm UTC](https://discourse.processing.org/t/p5js-instance-mode-how-to-manage-functions/25369 "2021-07-23T21:00:30Z")

</div>

I am using instance mode for a p5js project and I am trying to figure out the best way to keep my functions organised. Here is how I had my code organised originally: var rotateSketch = function(p){ p.setup = funct…

---

## [Multiple frame rates at any speed from 1 to 30FPS](https://discourse.processing.org/t/multiple-frame-rates-at-any-speed-from-1-to-30fps/31398)

<div class="topic-metadata">

**Author:** [@4dplane](https://discourse.processing.org/u/4dplane)\
**Replies:** 1\
**Last updated:** [July 23, 2021, 10:46am UTC](https://discourse.processing.org/t/multiple-frame-rates-at-any-speed-from-1-to-30fps/31398 "2021-07-23T10:46:52Z")

</div>

Hi, I am working in P5.JS and I am trying to achieve multiple frame rates for multiple animations that can have any framerate between 1FPS to 30FPS. Here is the main question: How to keep the master FPS at frameRate(30)…

---

## [How to play back my own voice?](https://discourse.processing.org/t/how-to-play-back-my-own-voice/31393)

<div class="topic-metadata">

**Author:** [@tony](https://discourse.processing.org/u/tony)\
**Replies:** 1\
**Last updated:** [July 22, 2021, 9:57pm UTC](https://discourse.processing.org/t/how-to-play-back-my-own-voice/31393 "2021-07-22T21:57:07Z")

</div>

Hey! Any p5.sound experts here? How would I make a sketch that lets me listen to my own audio, live? Not a “record a voice clip, then play it back” kind of deal, but a “speak into the mic, and listen to what I sound lik…

---

## [Transitions between states](https://discourse.processing.org/t/transitions-between-states/31376)

<div class="topic-metadata">

**Author:** [@k5221](https://discourse.processing.org/u/k5221)\
**Replies:** 4\
**Last updated:** [July 22, 2021, 4:23pm UTC](https://discourse.processing.org/t/transitions-between-states/31376 "2021-07-22T16:23:00Z")

</div>

Hi, I have drawIntro() for drawing the black intro screen and drawPlaying for the game screen. The screen switches to the playing mode when a player clicks the start button (handled by the mousePressed() below). What I …

---

## [Capture image is not shown](https://discourse.processing.org/t/capture-image-is-not-shown/31377)

<div class="topic-metadata">

**Author:** [@k5221](https://discourse.processing.org/u/k5221)\
**Replies:** 2\
**Last updated:** [July 22, 2021, 12:18pm UTC](https://discourse.processing.org/t/capture-image-is-not-shown/31377 "2021-07-22T12:18:25Z")

</div>

Hi, since some point of coding, my code has not been able to show an image on the canvas… My original intent was make the captured image (by webcam) as a background once the button is clicked and game starts playing, but…

---

## [Shader performance vs drawing array of points](https://discourse.processing.org/t/shader-performance-vs-drawing-array-of-points/31373)

<div class="topic-metadata">

**Author:** [@rkdnson](https://discourse.processing.org/u/rkdnson)\
**Replies:** 3\
**Last updated:** [July 22, 2021, 9:02am UTC](https://discourse.processing.org/t/shader-performance-vs-drawing-array-of-points/31373 "2021-07-22T09:02:39Z")

</div>

Hello all. I have a project where I want every other pixel to be black. This could be accomplished with two simple for loops; for (let x = 0; x \< width; x+=2) { for (let y = 0; y \< height; y+=2) { point(x,y);…

---

## [How to cycle between two colors using lerp](https://discourse.processing.org/t/how-to-cycle-between-two-colors-using-lerp/31370)

<div class="topic-metadata">

**Author:** [@cottonchipper](https://discourse.processing.org/u/cottonchipper)\
**Replies:** 2\
**Last updated:** [July 21, 2021, 8:37pm UTC](https://discourse.processing.org/t/how-to-cycle-between-two-colors-using-lerp/31370 "2021-07-21T20:37:12Z")

</div>

I’m trying to smoothly lerp back and forth between two colors repeatedly. The following changes from red to blue and then suddenly shifts back to red when the sketch loops. Is there a way to shift from red to blue to red…

---

## [indexOf does not match unicode string](https://discourse.processing.org/t/indexof-does-not-match-unicode-string/31319)

<div class="topic-metadata">

**Author:** [@JoseMY](https://discourse.processing.org/u/JoseMY)\
**Replies:** 2\
**Last updated:** [July 20, 2021, 12:00pm UTC](https://discourse.processing.org/t/indexof-does-not-match-unicode-string/31319 "2021-07-20T12:00:07Z")

</div>

Hi! I am reading a file called “Symbola605.txt” with loadStrings(). Then I use .indexOf at each line in order to find a word that marks the beginning of a character list. But it seems that .indexOf does not work with …

---

## [Moving effect of a set of dots](https://discourse.processing.org/t/moving-effect-of-a-set-of-dots/31263)

<div class="topic-metadata">

**Author:** [@k5221](https://discourse.processing.org/u/k5221)\
**Replies:** 3\
**Last updated:** [July 19, 2021, 9:54am UTC](https://discourse.processing.org/t/moving-effect-of-a-set-of-dots/31263 "2021-07-19T09:54:14Z")

</div>

Hi, I have a function to create one set of dots, which are individually created by ellipse() function. I hope to move one set (=individual dots within the set) right and left according to the frame rate, and each set mov…

---

## [P5js AudioIn function not working on instance mode](https://discourse.processing.org/t/p5js-audioin-function-not-working-on-instance-mode/31179)

<div class="topic-metadata">

**Author:** [@Seriously](https://discourse.processing.org/u/Seriously)\
**Replies:** 1\
**Last updated:** [July 18, 2021, 7:41pm UTC](https://discourse.processing.org/t/p5js-audioin-function-not-working-on-instance-mode/31179 "2021-07-18T19:41:16Z")

</div>

I was converting my p5js code to instance mode to run 2 canvases in the same DOM but my p5.AudioIn() function is not working. The error I get is referencing Failed to construct 'AudioWorkletNode' . I have uploaded a scre…

---

## [\[p5.js Sound\] Setting time between which amp.getLevel returns values](https://discourse.processing.org/t/p5-js-sound-setting-time-between-which-amp-getlevel-returns-values/31297)

<div class="topic-metadata">

**Author:** [@acagastya](https://discourse.processing.org/u/acagastya)\
**Replies:** 1\
**Last updated:** [July 18, 2021, 7:24pm UTC](https://discourse.processing.org/t/p5-js-sound-setting-time-between-which-amp-getlevel-returns-values/31297 "2021-07-18T19:24:14Z")

</div>

Hi, I am trying to get the amplitude of an audio file, to render something similar to the attached screenshot. I want to show the amp every 100ms only. If I understand correctly, amp.getLevel is called every time a n…

[Previous page](https://discourse.processing.org/c/p5js/10.md?page=38)

[Next page](https://discourse.processing.org/c/p5js/10.md?page=40)