# p5.js

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

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

**Page:** 25

---

## [Uncaught ReferenceError: createInput is not defined](https://discourse.processing.org/t/uncaught-referenceerror-createinput-is-not-defined/37089)

<div class="topic-metadata">

**Author:** [@bluemoon](https://discourse.processing.org/u/bluemoon)\
**Replies:** 0\
**Last updated:** [May 25, 2022, 8:05pm UTC](https://discourse.processing.org/t/uncaught-referenceerror-createinput-is-not-defined/37089 "2022-05-25T20:05:11Z")

</div>

Hi Folks, getting this error on the following code in the Processing IDE. Works fine in the web editor. Not sure what the difference is, or why it can’t find createInput, which is a a p5 function… any thoughts? thanks…

---

## [Keyboard keypresses are ignored](https://discourse.processing.org/t/keyboard-keypresses-are-ignored/34781)

<div class="topic-metadata">

**Author:** [@tanzor](https://discourse.processing.org/u/tanzor)\
**Replies:** 5\
**Last updated:** [May 24, 2022, 7:10am UTC](https://discourse.processing.org/t/keyboard-keypresses-are-ignored/34781 "2022-05-24T07:10:05Z")

</div>

Hello experts, I’m programming a psychology experiment using jsPsych and P5. Participants should see a stimulus on the screen, make a decision, press a button, and get feedback on the accuracy of their response before m…

---

## [How to organize radio buttons in separate lines?](https://discourse.processing.org/t/how-to-organize-radio-buttons-in-separate-lines/10041)

<div class="topic-metadata">

**Author:** [@togo](https://discourse.processing.org/u/togo)\
**Replies:** 7\
**Last updated:** [May 23, 2022, 5:41pm UTC](https://discourse.processing.org/t/how-to-organize-radio-buttons-in-separate-lines/10041 "2022-05-23T17:41:41Z")

</div>

Hello, I’m currently working on radio buttons. Right now, I have the following code. gender = createRadio(); gender.option('male'); gender.option('female'); gender.option('prefer not to say'); gender.position(10, 30);…

---

## [Glitch sound, p5.audio](https://discourse.processing.org/t/glitch-sound-p5-audio/37023)

<div class="topic-metadata">

**Author:** [@garrettlynch](https://discourse.processing.org/u/garrettlynch)\
**Replies:** 0\
**Last updated:** [May 22, 2022, 5:33pm UTC](https://discourse.processing.org/t/glitch-sound-p5-audio/37023 "2022-05-22T17:33:44Z")

</div>

Similar to the Pure Data example here (https://www.youtube.com/watch?v=FLK854QyjE4) I’m trying to conceptualise how a file, such as a text file, might be read in P5 and played back as glitch audio. How would I go about t…

---

## [Accessing local elements in another function in p5js](https://discourse.processing.org/t/accessing-local-elements-in-another-function-in-p5js/36978)

<div class="topic-metadata">

**Author:** [@lvndr](https://discourse.processing.org/u/lvndr)\
**Replies:** 0\
**Last updated:** [May 20, 2022, 5:20am UTC](https://discourse.processing.org/t/accessing-local-elements-in-another-function-in-p5js/36978 "2022-05-20T05:20:17Z")

</div>

I am pretty new to p5js and website building, I am doing a project for uni-related to emotion sensing Ai, basically, it generates recipes based on your emotion. I have built a random recipe generator but I need to append…

---

## [Kerning problem with .otf font in p5.js](https://discourse.processing.org/t/kerning-problem-with-otf-font-in-p5-js/36974)

<div class="topic-metadata">

**Author:** [@svan](https://discourse.processing.org/u/svan)\
**Replies:** 0\
**Last updated:** [May 20, 2022, 12:33am UTC](https://discourse.processing.org/t/kerning-problem-with-otf-font-in-p5-js/36974 "2022-05-20T00:33:39Z")

</div>

A kerning problem with an .otf font called NewgroundsFont-Regular has been posted on Stack Overflow and there have been no answers which address the underlying problem, so I am reposting a shortened version of the source…

---

## [Traversing elements inside an array which is inside another array in p5js](https://discourse.processing.org/t/traversing-elements-inside-an-array-which-is-inside-another-array-in-p5js/36923)

<div class="topic-metadata">

**Author:** [@lvndr](https://discourse.processing.org/u/lvndr)\
**Replies:** 1\
**Last updated:** [May 17, 2022, 8:32pm UTC](https://discourse.processing.org/t/traversing-elements-inside-an-array-which-is-inside-another-array-in-p5js/36923 "2022-05-17T20:32:28Z")

</div>

Is there a way in p5js to traverse elements inside an array that is inside another array? This is the CSV file I am using, and I want to access the elements inside the ingredients column one by one. Since each row ha…

---

## [Differences between image(), createImage and createImg()](https://discourse.processing.org/t/differences-between-image-createimage-and-createimg/36913)

<div class="topic-metadata">

**Author:** [@teemee](https://discourse.processing.org/u/teemee)\
**Replies:** 0\
**Last updated:** [May 17, 2022, 7:33am UTC](https://discourse.processing.org/t/differences-between-image-createimage-and-createimg/36913 "2022-05-17T07:33:10Z")

</div>

I am curious about these three image functions image(); createImg(); createImage(); I have read the reference pages but still want some clear explanation. Is the creatImage() works with pixel related graphic and the …

---

## [Typing effect p5js](https://discourse.processing.org/t/typing-effect-p5js/36875)

<div class="topic-metadata">

**Author:** [@luciaromancanivell](https://discourse.processing.org/u/luciaromancanivell)\
**Replies:** 1\
**Last updated:** [May 13, 2022, 6:42pm UTC](https://discourse.processing.org/t/typing-effect-p5js/36875 "2022-05-13T18:42:56Z")

</div>

Hello, Sorry to bother you again, I am in a programming class and for our homework trying to animate and make a typography effect that repeats itself but I am getting a bit confused, any help? Thank you! var canvasWH = …

---

## [Replicating text](https://discourse.processing.org/t/replicating-text/36853)

<div class="topic-metadata">

**Author:** [@luciaromancanivell](https://discourse.processing.org/u/luciaromancanivell)\
**Replies:** 4\
**Last updated:** [May 13, 2022, 2:46pm UTC](https://discourse.processing.org/t/replicating-text/36853 "2022-05-13T14:46:10Z")

</div>

please format code with \</\> button \* homework policy \* asking questions Hello again, I am working on a school project where we have to create this with a loop… but I can only get a dark blur, here is the result I ne…

---

## [Overlaying webcam input (transparent way )on top of WebGL canvas?](https://discourse.processing.org/t/overlaying-webcam-input-transparent-way-on-top-of-webgl-canvas/36833)

<div class="topic-metadata">

**Author:** [@Timo](https://discourse.processing.org/u/Timo)\
**Replies:** 0\
**Last updated:** [May 11, 2022, 7:54pm UTC](https://discourse.processing.org/t/overlaying-webcam-input-transparent-way-on-top-of-webgl-canvas/36833 "2022-05-11T19:54:47Z")

</div>

Hi, I have been trying to overlay webcam feed on top of a webGL canvas having cube shapes . In the sketch The cube originates from -z value and moves towards the user When i dont have the video/ webcam element overlaid…

---

## [Calling .loadPixels() on a video freezes the feed?](https://discourse.processing.org/t/calling-loadpixels-on-a-video-freezes-the-feed/36822)

<div class="topic-metadata">

**Author:** [@jaschanarveson](https://discourse.processing.org/u/jaschanarveson)\
**Replies:** 1\
**Last updated:** [May 11, 2022, 2:24pm UTC](https://discourse.processing.org/t/calling-loadpixels-on-a-video-freezes-the-feed/36822 "2022-05-11T14:24:56Z")

</div>

I have a sketch where I’m getting a video feed with createCapture(VIDEO), then toggling between states where I either see the straight feed or I pixelate the image. Here’s what’s happening: run the sketch, feed works …

---

## [P5 library - YOLO / Web works well, but does not work in p5](https://discourse.processing.org/t/p5-library-yolo-web-works-well-but-does-not-work-in-p5/36790)

<div class="topic-metadata">

**Author:** [@GWAK](https://discourse.processing.org/u/GWAK)\
**Replies:** 2\
**Last updated:** [May 10, 2022, 6:35am UTC](https://discourse.processing.org/t/p5-library-yolo-web-works-well-but-does-not-work-in-p5/36790 "2022-05-10T06:35:39Z")

</div>

\[p5 library - YOLO / Web works well, but does not work in p5.\] hello. Source code running on the web https://editor.p5js.org/ml5/sketches/ObjectDetector\_YOLO\_single\_image It works fine. If you copy the WEB source…

---

## [Repeat the same random positions of ellipses after n seconds](https://discourse.processing.org/t/repeat-the-same-random-positions-of-ellipses-after-n-seconds/36771)

<div class="topic-metadata">

**Author:** [@celinewassmer](https://discourse.processing.org/u/celinewassmer)\
**Replies:** 1\
**Last updated:** [May 8, 2022, 8:19pm UTC](https://discourse.processing.org/t/repeat-the-same-random-positions-of-ellipses-after-n-seconds/36771 "2022-05-08T20:19:20Z")

</div>

Hi there! I’m workiung with the following code in p5js to make an animation of ellipses (raindrops). In the end I want to loop my video (screen recording). So the positions of the ellipses have to be in the same positio…

---

## [Logic on making a circle disappear when clicked and drawing another circle at the same time](https://discourse.processing.org/t/logic-on-making-a-circle-disappear-when-clicked-and-drawing-another-circle-at-the-same-time/35066)

<div class="topic-metadata">

**Author:** [@Timo](https://discourse.processing.org/u/Timo)\
**Replies:** 45\
**Last updated:** [May 6, 2022, 2:17pm UTC](https://discourse.processing.org/t/logic-on-making-a-circle-disappear-when-clicked-and-drawing-another-circle-at-the-same-time/35066 "2022-05-06T14:17:00Z")

</div>

Hello, I am currently struggling the way forward regarding the following On a mouse click inside a given circle the circle disappears At the same time another is drawn on the canvas .The same process repeats, that …

---

## [Map one region to another](https://discourse.processing.org/t/map-one-region-to-another/36720)

<div class="topic-metadata">

**Author:** [@guille](https://discourse.processing.org/u/guille)\
**Replies:** 1\
**Last updated:** [May 5, 2022, 10:37pm UTC](https://discourse.processing.org/t/map-one-region-to-another/36720 "2022-05-05T22:37:26Z")

</div>

I am working on a sketch to get Pythagorean dissections from Pythagorean tilings (here). I am having a hard time trying to rotate the region in the black square so that it appears with vertical/horizontal sides (some of …

---

## [P5.js or P5 for an interactive audiovisual performance?](https://discourse.processing.org/t/p5-js-or-p5-for-an-interactive-audiovisual-performance/36734)

<div class="topic-metadata">

**Author:** [@nint](https://discourse.processing.org/u/nint)\
**Replies:** 1\
**Last updated:** [May 5, 2022, 5:56pm UTC](https://discourse.processing.org/t/p5-js-or-p5-for-an-interactive-audiovisual-performance/36734 "2022-05-05T17:56:45Z")

</div>

Hi! I’m working for an interactive audiovisual performance in realtime (~70-80 min) where, based from audio analysis (mainly FFT) I will generate movements for metaball rendering. For instance he metaball rendering is …

---

## [PFront results gazillion amount of cache file, how to avoid it?](https://discourse.processing.org/t/pfront-results-gazillion-amount-of-cache-file-how-to-avoid-it/36737)

<div class="topic-metadata">

**Author:** [@psamead](https://discourse.processing.org/u/psamead)\
**Replies:** 2\
**Last updated:** [May 5, 2022, 4:27pm UTC](https://discourse.processing.org/t/pfront-results-gazillion-amount-of-cache-file-how-to-avoid-it/36737 "2022-05-05T16:27:56Z")

</div>

Hi my friends, I am trying to convert the guest tutorial matrix rain from coding train to processing version. But I found that the code will result gazillion amount of cache file to my disk, maybe because I am using PFo…

---

## [P5 sound - connecting filters in series](https://discourse.processing.org/t/p5-sound-connecting-filters-in-series/36728)

<div class="topic-metadata">

**Author:** [@spurge](https://discourse.processing.org/u/spurge)\
**Replies:** 0\
**Last updated:** [May 5, 2022, 11:05am UTC](https://discourse.processing.org/t/p5-sound-connecting-filters-in-series/36728 "2022-05-05T11:05:19Z")

</div>

Hello, I’m a beginner with a question regarding p5 sound. I’m looking for a proper way to cascade filters, that is connecting them in series. For now, I’m using a lowshelf and a highshelf filter. In the example code, r…

---

## [Printing a Vector before and after changing it produces unexpected results](https://discourse.processing.org/t/printing-a-vector-before-and-after-changing-it-produces-unexpected-results/32111)

<div class="topic-metadata">

**Author:** [@norm\_krumpe](https://discourse.processing.org/u/norm_krumpe)\
**Replies:** 16\
**Last updated:** [May 4, 2022, 6:33am UTC](https://discourse.processing.org/t/printing-a-vector-before-and-after-changing-it-produces-unexpected-results/32111 "2022-05-04T06:33:36Z")

</div>

I’m putting together a short exercise for my students on p5.Vector and its operations. The output of the code below surprises me, and I was hoping someone could explain what’s going on. I’ve been programming in Processin…

---

## [Ways to convert drawn curve to bezier points?](https://discourse.processing.org/t/ways-to-convert-drawn-curve-to-bezier-points/36695)

<div class="topic-metadata">

**Author:** [@jessica.mingyu](https://discourse.processing.org/u/jessica.mingyu)\
**Replies:** 1\
**Last updated:** [May 3, 2022, 9:36pm UTC](https://discourse.processing.org/t/ways-to-convert-drawn-curve-to-bezier-points/36695 "2022-05-03T21:36:44Z")

</div>

Is there a site/toolkit where I can draw out a bezier curve and it would output the vertices of the control/anchor points for me? Thanks! I tried googling with “convert curve to bezier” “bezier automate”, but none showe…

---

## [Uploading a file to the P5 Web Editor](https://discourse.processing.org/t/uploading-a-file-to-the-p5-web-editor/36700)

<div class="topic-metadata">

**Author:** [@NationalRex22](https://discourse.processing.org/u/NationalRex22)\
**Replies:** 1\
**Last updated:** [May 3, 2022, 8:16pm UTC](https://discourse.processing.org/t/uploading-a-file-to-the-p5-web-editor/36700 "2022-05-03T20:16:44Z")

</div>

Hello, How do I upload a file or a picture while I’m working in your p5.js Web Editor?

---

## [Including a library?](https://discourse.processing.org/t/including-a-library/36701)

<div class="topic-metadata">

**Author:** [@NationalRex22](https://discourse.processing.org/u/NationalRex22)\
**Replies:** 0\
**Last updated:** [May 3, 2022, 6:49pm UTC](https://discourse.processing.org/t/including-a-library/36701 "2022-05-03T18:49:55Z")

</div>

Hello, How do I add a library with the code I’m working with on the p5.js Web Editor?

---

## [Translating and scaling for better zoom](https://discourse.processing.org/t/translating-and-scaling-for-better-zoom/36689)

<div class="topic-metadata">

**Author:** [@Ckyiu](https://discourse.processing.org/u/Ckyiu)\
**Replies:** 3\
**Last updated:** [May 3, 2022, 2:51pm UTC](https://discourse.processing.org/t/translating-and-scaling-for-better-zoom/36689 "2022-05-03T14:51:49Z")

</div>

In this project I’m working on, I’ve implemented panning and zooming around. Panning works great, and the zoom works, but it’s unnatural, as it zooms in on the origin instead of where your mouse cursor is. I’ve created …

---

## [P5.js to GCODE: canvas drawing calls](https://discourse.processing.org/t/p5-js-to-gcode-canvas-drawing-calls/22969)

<div class="topic-metadata">

**Author:** [@emnullfuenf](https://discourse.processing.org/u/emnullfuenf)\
**Replies:** 7\
**Last updated:** [May 1, 2022, 9:31am UTC](https://discourse.processing.org/t/p5-js-to-gcode-canvas-drawing-calls/22969 "2022-05-01T09:31:49Z")

</div>

Hello all, i would like to write a library that translates p5’s drawing calls of shape primitives and text to GCODE for plotters. Is there maybe a simpler way to hook p5’s drawing calls than extending p5.Renderer2D.js? …

---

## [Change background color when mousePressed](https://discourse.processing.org/t/change-background-color-when-mousepressed/36660)

<div class="topic-metadata">

**Author:** [@luciaromancanivell](https://discourse.processing.org/u/luciaromancanivell)\
**Replies:** 1\
**Last updated:** [April 30, 2022, 7:48pm UTC](https://discourse.processing.org/t/change-background-color-when-mousepressed/36660 "2022-04-30T19:48:11Z")

</div>

Hello, I am trying to make the background change when pressing each circle here, but I cannot get it to work, it is always white, any help? The circles are supposed to grow and be black when rolling over and the backgrou…

---

## [Having stroke highlight quad edges in 3D .obj?](https://discourse.processing.org/t/having-stroke-highlight-quad-edges-in-3d-obj/36648)

<div class="topic-metadata">

**Author:** [@BandelierTapes](https://discourse.processing.org/u/BandelierTapes)\
**Replies:** 2\
**Last updated:** [April 29, 2022, 8:36pm UTC](https://discourse.processing.org/t/having-stroke-highlight-quad-edges-in-3d-obj/36648 "2022-04-29T20:36:00Z")

</div>

Hello there! I’m working on a project to display some simple geometries on a canvas. I have a 3D hexagonal prism I’ve made in Blender and I’d like to pretty it up a bit… The left side of the image is how the hexagon …

---

## [Fullscreen() choice of return values](https://discourse.processing.org/t/fullscreen-choice-of-return-values/36618)

<div class="topic-metadata">

**Author:** [@fabiopettinati](https://discourse.processing.org/u/fabiopettinati)\
**Replies:** 4\
**Last updated:** [April 28, 2022, 5:53pm UTC](https://discourse.processing.org/t/fullscreen-choice-of-return-values/36618 "2022-04-28T17:53:58Z")

</div>

I was playing with fullscreen() in p5.js and the prototypical way of toggling state in the reference: let fs = fullscreen(); fullscreen(!fs); The values returned for fs depend on the state: Windowed mode… undefined F…

---

## [Problem with JSDoc createGraphics() annotation in my sketch](https://discourse.processing.org/t/problem-with-jsdoc-creategraphics-annotation-in-my-sketch/36569)

<div class="topic-metadata">

**Author:** [@SNitaine](https://discourse.processing.org/u/SNitaine)\
**Replies:** 1\
**Last updated:** [April 26, 2022, 6:46pm UTC](https://discourse.processing.org/t/problem-with-jsdoc-creategraphics-annotation-in-my-sketch/36569 "2022-04-26T18:46:50Z")

</div>

When working with createGraphics() how do you set the correct JSDoc comment for the global variable var pg that is declared global outside of setup() and draw(). let say we start with a simple sketch like this: var pg …

---

## [Cube explosion when clicking inside the cube](https://discourse.processing.org/t/cube-explosion-when-clicking-inside-the-cube/36573)

<div class="topic-metadata">

**Author:** [@Timo](https://discourse.processing.org/u/Timo)\
**Replies:** 1\
**Last updated:** [April 26, 2022, 2:13pm UTC](https://discourse.processing.org/t/cube-explosion-when-clicking-inside-the-cube/36573 "2022-04-26T14:13:15Z")

</div>

Hello everyone, in my sketch I am using WEBGL and ScreenPosition js to create a new cube whenever the mouse X , mouseY co-ordinates are inside the cube. I am currently trying to make the cube explode when the above condi…

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

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