# p5.js

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

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

**Page:** 74

---

## [Rotation / sound reactive / stopping drawing](https://discourse.processing.org/t/rotation-sound-reactive-stopping-drawing/20160)

<div class="topic-metadata">

**Author:** [@malindra](https://discourse.processing.org/u/malindra)\
**Replies:** 2\
**Last updated:** [April 26, 2020, 1:03pm UTC](https://discourse.processing.org/t/rotation-sound-reactive-stopping-drawing/20160 "2020-04-26T13:03:37Z")

</div>

i’m totally new to coding and p5 - i’ve been messing creating a visualiser from the intro tutorials and grabbing bits and pieces from different tuts. Basically - is there away to rotate all the ellipses/objects on the…

---

## [Unable to vizualize a sorted array while implementing mergesort](https://discourse.processing.org/t/unable-to-vizualize-a-sorted-array-while-implementing-mergesort/20122)

<div class="topic-metadata">

**Author:** [@Suraaj](https://discourse.processing.org/u/Suraaj)\
**Replies:** 4\
**Last updated:** [April 26, 2020, 6:50am UTC](https://discourse.processing.org/t/unable-to-vizualize-a-sorted-array-while-implementing-mergesort/20122 "2020-04-26T06:50:50Z")

</div>

I tried to implement a mergesort algorithm but the array isn’t getting sorted for some reason.The expected output is a sorted array of lines displayed on the browser window. Here is my code var values = \[\] function se…

---

## [Ml5 - Feature Extractor Classification using image files (edited)](https://discourse.processing.org/t/ml5-feature-extractor-classification-using-image-files-edited/20067)

<div class="topic-metadata">

**Author:** [@gjs](https://discourse.processing.org/u/gjs)\
**Replies:** 0\
**Last updated:** [April 23, 2020, 2:01pm UTC](https://discourse.processing.org/t/ml5-feature-extractor-classification-using-image-files-edited/20067 "2020-04-23T14:01:51Z")

</div>

After having viewed Dan Shiffman’s Feature Extractor Classification lesson, I’m attempting to train my model using preloaded jpgs rather than grabbing webcam images, similar to the option offered in Google’s Teachable Ma…

---

## [Problems using getItem and storeItem - any suggestions](https://discourse.processing.org/t/problems-using-getitem-and-storeitem-any-suggestions/20108)

<div class="topic-metadata">

**Author:** [@RetProf](https://discourse.processing.org/u/RetProf)\
**Replies:** 2\
**Last updated:** [April 24, 2020, 8:54pm UTC](https://discourse.processing.org/t/problems-using-getitem-and-storeitem-any-suggestions/20108 "2020-04-24T20:54:27Z")

</div>

I am attempting to develop a sketch that will collect information and store it for use in subsequent reloads of the sketch. Given the information related to the “storeInfo” and “getInfo” operations I was under the impres…

---

## [3d Scrolling terrain with music w/ P5js](https://discourse.processing.org/t/3d-scrolling-terrain-with-music-w-p5js/20105)

<div class="topic-metadata">

**Author:** [@moscardo](https://discourse.processing.org/u/moscardo)\
**Replies:** 0\
**Last updated:** [April 24, 2020, 5:41pm UTC](https://discourse.processing.org/t/3d-scrolling-terrain-with-music-w-p5js/20105 "2020-04-24T17:41:25Z")

</div>

Hi guys, I’m a newbie of P5js and I would like to create a scrolling terrain in 3D. Here’s the link to my code repo. I’m using the sound to generate the terrain shape (FFT bins) but I’ve some problems in rendering it. …

---

## [How to add text inside circle or any other shapes in p5.js](https://discourse.processing.org/t/how-to-add-text-inside-circle-or-any-other-shapes-in-p5-js/20092)

<div class="topic-metadata">

**Author:** [@pravandan](https://discourse.processing.org/u/pravandan)\
**Replies:** 2\
**Last updated:** [April 24, 2020, 1:55pm UTC](https://discourse.processing.org/t/how-to-add-text-inside-circle-or-any-other-shapes-in-p5-js/20092 "2020-04-24T13:55:35Z")

</div>

I have the following code and I want to display different text in different circles. How to achieve that ? // Uses P5.js for canvas creation and drawing function setup() { var circles = \[\], circle = {}, ov…

---

## [Run a javascript function from p5.js or read a variable in the DOM](https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090)

<div class="topic-metadata">

**Author:** [@paolon](https://discourse.processing.org/u/paolon)\
**Replies:** 3\
**Last updated:** [April 24, 2020, 1:55pm UTC](https://discourse.processing.org/t/run-a-javascript-function-from-p5-js-or-read-a-variable-in-the-dom/20090 "2020-04-24T13:55:07Z")

</div>

Hi everyone, it’s a pleasure to join this community! I have a problem that I think is quite simple for you but I have been banging my head for days for which I ask for your help. I want to make a kind of universal watch…

---

## [Is Println deprecated?](https://discourse.processing.org/t/is-println-deprecated/19929)

<div class="topic-metadata">

**Author:** [@endurance21](https://discourse.processing.org/u/endurance21)\
**Replies:** 5\
**Last updated:** [April 24, 2020, 4:25am UTC](https://discourse.processing.org/t/is-println-deprecated/19929 "2020-04-24T04:25:42Z")

</div>

is the method println() to print a new line deprecated? because it is still being used in p5.js-sound sketches and it throws an error saying prinln is not defined!!! i am using p5.js version 0.6.1 p5.js-sound versio…

---

## [Compare Color Variables](https://discourse.processing.org/t/compare-color-variables/17238)

<div class="topic-metadata">

**Author:** [@nciprian](https://discourse.processing.org/u/nciprian)\
**Replies:** 5\
**Last updated:** [April 22, 2020, 11:43pm UTC](https://discourse.processing.org/t/compare-color-variables/17238 "2020-04-22T23:43:17Z")

</div>

Hello, Is there a way to compare to color variable? let inside = color(204, 102, 0); let middle = color(204, 102, 0); i need to compare this two variables, but none of the usual ways work. (inside == middle)

---

## [Signal Averaging P5JS](https://discourse.processing.org/t/signal-averaging-p5js/17735)

<div class="topic-metadata">

**Author:** [@black](https://discourse.processing.org/u/black)\
**Replies:** 3\
**Last updated:** [April 22, 2020, 5:01pm UTC](https://discourse.processing.org/t/signal-averaging-p5js/17735 "2020-04-22T17:01:21Z")

</div>

So I was writing the signal averaging code on a random generated data. Steps I did - Generating a signal to simulated Real time data Signal = random data (-10,10) + periodic data (50,100 ) after every 100 tx Taking sa…

---

## [Enabling face detection p5.js camera access in chrome extension](https://discourse.processing.org/t/enabling-face-detection-p5-js-camera-access-in-chrome-extension/20034)

<div class="topic-metadata">

**Author:** [@yuinjann](https://discourse.processing.org/u/yuinjann)\
**Replies:** 0\
**Last updated:** [April 22, 2020, 2:00pm UTC](https://discourse.processing.org/t/enabling-face-detection-p5-js-camera-access-in-chrome-extension/20034 "2020-04-22T14:00:41Z")

</div>

Hiya! I am trying to make a pop up chrome extension using this face detector example made with p5.js from https://github.com/stc/face-tracking-p5js/tree/master/008\_emotion example. Basically, I want to count the number …

---

## [P5js WebGL sketch exports with transparent background](https://discourse.processing.org/t/p5js-webgl-sketch-exports-with-transparent-background/20023)

<div class="topic-metadata">

**Author:** [@1igor](https://discourse.processing.org/u/1igor)\
**Replies:** 1\
**Last updated:** [April 22, 2020, 9:25am UTC](https://discourse.processing.org/t/p5js-webgl-sketch-exports-with-transparent-background/20023 "2020-04-22T09:25:33Z")

</div>

Hi! I have a problem with WebGL: anything in browser works fine but when I try to save image or use CCapture, it exports my canvas with transparent background instead of one I have. I have tried setting background using b…

---

## [Image Slice Tool – Output Canvas Resolution Issue](https://discourse.processing.org/t/image-slice-tool-output-canvas-resolution-issue/19997)

<div class="topic-metadata">

**Author:** [@matejvojtus](https://discourse.processing.org/u/matejvojtus)\
**Replies:** 1\
**Last updated:** [April 21, 2020, 11:56pm UTC](https://discourse.processing.org/t/image-slice-tool-output-canvas-resolution-issue/19997 "2020-04-21T23:56:49Z")

</div>

Hi everyone, I am quite new to p5js world and I am trying to create an Image slicing tool. The code gets me the wanted result – sliced input image but it seems that it doesn’t retain the intial resolution of the image…

---

## [How do i make doubleClicked() run without call existing mousePressed()? (p5.js)](https://discourse.processing.org/t/how-do-i-make-doubleclicked-run-without-call-existing-mousepressed-p5-js/19982)

<div class="topic-metadata">

**Author:** [@Royjan](https://discourse.processing.org/u/Royjan)\
**Replies:** 5\
**Last updated:** [April 21, 2020, 5:55pm UTC](https://discourse.processing.org/t/how-do-i-make-doubleclicked-run-without-call-existing-mousepressed-p5-js/19982 "2020-04-21T17:55:13Z")

</div>

Hello everybody, So i have a problem to call doubleClicked() function without calling existing mousePressed() function. Can please anyone give me a trick for that one? Thanks!!

---

## [Run p5ks sketch in specific div from string](https://discourse.processing.org/t/run-p5ks-sketch-in-specific-div-from-string/19999)

<div class="topic-metadata">

**Author:** [@anon57009815](https://discourse.processing.org/u/anon57009815)\
**Replies:** 4\
**Last updated:** [April 21, 2020, 12:16pm UTC](https://discourse.processing.org/t/run-p5ks-sketch-in-specific-div-from-string/19999 "2020-04-21T12:16:35Z")

</div>

Hello and good day. I am currently acessing a string of a small p5js project and I want to use it to run a new project in a specific div. Any quick help with this? /\*\* small project multiline string \*/ function setup…

---

## [How to get the file path of a file dropped in the webpage](https://discourse.processing.org/t/how-to-get-the-file-path-of-a-file-dropped-in-the-webpage/19870)

<div class="topic-metadata">

**Author:** [@CodingIsLife](https://discourse.processing.org/u/CodingIsLife)\
**Replies:** 3\
**Last updated:** [April 21, 2020, 1:38am UTC](https://discourse.processing.org/t/how-to-get-the-file-path-of-a-file-dropped-in-the-webpage/19870 "2020-04-21T01:38:59Z")

</div>

I was trying to make a drag and drop just like this video by Daniel Shiffman https://www.youtube.com/watch?v=o4UmGrPst\_c&t=317s But I was wandering if I could get the file path of the dropped file and thus download the …

---

## [Error Message on console "createElement"](https://discourse.processing.org/t/error-message-on-console-createelement/19765)

<div class="topic-metadata">

**Author:** [@Mem](https://discourse.processing.org/u/Mem)\
**Replies:** 7\
**Last updated:** [April 20, 2020, 8:17pm UTC](https://discourse.processing.org/t/error-message-on-console-createelement/19765 "2020-04-20T20:17:16Z")

</div>

Hello, Any code that I try will give me this console message, (working with chrome) Some code works others not, that’s a very recent issue. There is no createElement on any of my code “p5 had problems creating the gl…

---

## [Get image from webcam capture](https://discourse.processing.org/t/get-image-from-webcam-capture/19381)

<div class="topic-metadata">

**Author:** [@SenseiJae](https://discourse.processing.org/u/SenseiJae)\
**Replies:** 2\
**Last updated:** [April 19, 2020, 11:18pm UTC](https://discourse.processing.org/t/get-image-from-webcam-capture/19381 "2020-04-19T23:18:24Z")

</div>

I’m trying to follow “coding train’s” example of capturing images from a webcam for a “photo booth”. It was working great up until I go to the for loop to capture the images. When I use “get()” on the createCapture() o…

---

## ["Get" as color detector?](https://discourse.processing.org/t/get-as-color-detector/19912)

<div class="topic-metadata">

**Author:** [@mnoble](https://discourse.processing.org/u/mnoble)\
**Replies:** 13\
**Last updated:** [April 19, 2020, 8:41pm UTC](https://discourse.processing.org/t/get-as-color-detector/19912 "2020-04-19T20:41:48Z")

</div>

Hello Forum :slight\_smile: On Processing, I love this program for detecting colors: color c; void setup (){ size (200,200); } void draw() { background (0); fill (255); rect (0,0,100,200); c = get (mouseX,m…

---

## [P5.js and Django: Saving a soundfile to a server](https://discourse.processing.org/t/p5-js-and-django-saving-a-soundfile-to-a-server/19930)

<div class="topic-metadata">

**Author:** [@grasshopper314159](https://discourse.processing.org/u/grasshopper314159)\
**Replies:** 0\
**Last updated:** [April 19, 2020, 11:44am UTC](https://discourse.processing.org/t/p5-js-and-django-saving-a-soundfile-to-a-server/19930 "2020-04-19T11:44:45Z")

</div>

I am trying to record audio through the user’s microphone and then save it as a .wav file on the server running Django. I based my code on this: https://discourse.processing.org/t/uploading-recorded-audio-to-web-server-n…

---

## [Print() Causes Animation Lagging - Are there fixes? What else causes lags?](https://discourse.processing.org/t/print-causes-animation-lagging-are-there-fixes-what-else-causes-lags/19702)

<div class="topic-metadata">

**Author:** [@mnoble](https://discourse.processing.org/u/mnoble)\
**Replies:** 3\
**Last updated:** [April 18, 2020, 10:46pm UTC](https://discourse.processing.org/t/print-causes-animation-lagging-are-there-fixes-what-else-causes-lags/19702 "2020-04-18T22:46:58Z")

</div>

Hello Forum, I am in the processing of shifting from Processing to p5Js for my high school class that is now online starting Monday. We love to use print() to learn but I noticed that it causes severe lag for animations…

---

## [Inherit/Use p5.Vector methods in NodeJS](https://discourse.processing.org/t/inherit-use-p5-vector-methods-in-nodejs/19909)

<div class="topic-metadata">

**Author:** [@cake](https://discourse.processing.org/u/cake)\
**Replies:** 4\
**Last updated:** [April 18, 2020, 10:34pm UTC](https://discourse.processing.org/t/inherit-use-p5-vector-methods-in-nodejs/19909 "2020-04-18T22:34:38Z")

</div>

Hello! I’d like to inherit & use p5.Vector & its methods in a class I’m writing. / Use p5.Vector without a window. This is backend code, I’ve seen that p5 cannot ‘run’ without a ‘window’ object. As it gives me ‘window’ …

---

## [Text appears in different positions](https://discourse.processing.org/t/text-appears-in-different-positions/19720)

<div class="topic-metadata">

**Author:** [@Bassam](https://discourse.processing.org/u/Bassam)\
**Replies:** 1\
**Last updated:** [April 18, 2020, 6:51pm UTC](https://discourse.processing.org/t/text-appears-in-different-positions/19720 "2020-04-18T18:51:27Z")

</div>

I had an earlier problem where buttons didn’t stay where I wanted on the canvas. I managed to resolve that problem. I should say resolved somewhat because the position is slightly different in Chrome compared to Mozilla. …

---

## [Transferring files with p5 js, node js, socket io](https://discourse.processing.org/t/transferring-files-with-p5-js-node-js-socket-io/19881)

<div class="topic-metadata">

**Author:** [@CodingIsLife](https://discourse.processing.org/u/CodingIsLife)\
**Replies:** 0\
**Last updated:** [April 18, 2020, 7:04am UTC](https://discourse.processing.org/t/transferring-files-with-p5-js-node-js-socket-io/19881 "2020-04-18T07:04:05Z")

</div>

Hello! I am using p5 js for developing a very simple chat platform. I am also using node and socket. The video series I am following created by Coding Train I implemented the chatting concept successfully. But now I wa…

---

## [Using createA() with a '#' instead of a url loads the current page in the web editor](https://discourse.processing.org/t/using-createa-with-a-instead-of-a-url-loads-the-current-page-in-the-web-editor/19864)

<div class="topic-metadata">

**Author:** [@Vera](https://discourse.processing.org/u/Vera)\
**Replies:** 3\
**Last updated:** [April 17, 2020, 7:50pm UTC](https://discourse.processing.org/t/using-createa-with-a-instead-of-a-url-loads-the-current-page-in-the-web-editor/19864 "2020-04-17T19:50:41Z")

</div>

I’m currently following the tutorials from The Coding Train on p5.js and I’ve run into a problem with the createA() DOM element. They are a bit older and I’m not sure if this is a bug or something I’m doing wrong… In vi…

---

## [TypeError when sketch hosted on a webserver but not when on my computer?](https://discourse.processing.org/t/typeerror-when-sketch-hosted-on-a-webserver-but-not-when-on-my-computer/19762)

<div class="topic-metadata">

**Author:** [@Bassam](https://discourse.processing.org/u/Bassam)\
**Replies:** 9\
**Last updated:** [April 16, 2020, 2:04am UTC](https://discourse.processing.org/t/typeerror-when-sketch-hosted-on-a-webserver-but-not-when-on-my-computer/19762 "2020-04-16T02:04:27Z")

</div>

So my p5js script script runs fine on the web editor and also when I run it in Atom but when I upload it to my web host and access the page from there, I get: TypeError: cnv is undefined or TypeError: cannot read prop…

---

## [Fixed navigation menu](https://discourse.processing.org/t/fixed-navigation-menu/19766)

<div class="topic-metadata">

**Author:** [@Rahulm2310](https://discourse.processing.org/u/Rahulm2310)\
**Replies:** 4\
**Last updated:** [April 15, 2020, 7:25am UTC](https://discourse.processing.org/t/fixed-navigation-menu/19766 "2020-04-15T07:25:16Z")

</div>

I propose this feature to have a fixed menu on the p5.js website. This will surely increase the accessibility and ease navigation on website. The menu should fix after little scroll and the webpage content should be scr…

---

## [Can 2 buttons call the same function and detect which button was pressed?](https://discourse.processing.org/t/can-2-buttons-call-the-same-function-and-detect-which-button-was-pressed/19654)

<div class="topic-metadata">

**Author:** [@Bassam](https://discourse.processing.org/u/Bassam)\
**Replies:** 2\
**Last updated:** [April 11, 2020, 4:16pm UTC](https://discourse.processing.org/t/can-2-buttons-call-the-same-function-and-detect-which-button-was-pressed/19654 "2020-04-11T16:16:59Z")

</div>

I have 2 images on a canvas and each image has it’s own button. When the first button is pressed, the first image is selected. When the second button is pressed, the second image is selected. button1 = createButton("S…

---

## [Why does it happen?](https://discourse.processing.org/t/why-does-it-happen/19772)

<div class="topic-metadata">

**Author:** [@Orlando](https://discourse.processing.org/u/Orlando)\
**Replies:** 2\
**Last updated:** [April 14, 2020, 5:37pm UTC](https://discourse.processing.org/t/why-does-it-happen/19772 "2020-04-14T17:37:55Z")

</div>

Hello. Why my program doesn’t return the sequel 0.0, 0.1, 0.2, 0.3, 0.4, 0.5… and so on ??? Take a look: var c; function setup() { createCanvas(400, 400); c = 0; } function draw() { c += 0.1 print(c); } And t…

---

## [Making a shape face the mouse](https://discourse.processing.org/t/making-a-shape-face-the-mouse/19735)

<div class="topic-metadata">

**Author:** [@poppyseeds](https://discourse.processing.org/u/poppyseeds)\
**Replies:** 3\
**Last updated:** [April 14, 2020, 10:30am UTC](https://discourse.processing.org/t/making-a-shape-face-the-mouse/19735 "2020-04-14T10:30:15Z")

</div>

In this sketch, I have two ellipses that look like a fish. It follows the position of the invisible cursor. Along with moving as it currently is, I want to make the fish face the cursor at all times which means if i move…

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

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