# p5.js

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

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

**Page:** 53

---

## [How to test various sketches in nested folders](https://discourse.processing.org/t/how-to-test-various-sketches-in-nested-folders/27323)

<div class="topic-metadata">

**Author:** [@skypickle](https://discourse.processing.org/u/skypickle)\
**Replies:** 1\
**Last updated:** [January 24, 2021, 2:36am UTC](https://discourse.processing.org/t/how-to-test-various-sketches-in-nested-folders/27323 "2021-01-24T02:36:29Z")

</div>

I use browser sync and sublime text to test my sketches. In a folder named project, I have: the index.html file (that refers to sketch.js) the sketch.js file the p5 folder. I subsequently made a modification to inde…

---

## [Website sometimes unable to load. Preload() sound file issue](https://discourse.processing.org/t/website-sometimes-unable-to-load-preload-sound-file-issue/27324)

<div class="topic-metadata">

**Author:** [@nsegal](https://discourse.processing.org/u/nsegal)\
**Replies:** 0\
**Last updated:** [January 24, 2021, 2:18am UTC](https://discourse.processing.org/t/website-sometimes-unable-to-load-preload-sound-file-issue/27324 "2021-01-24T02:18:29Z")

</div>

I’ve made a website with a sketch that utilizes the preload() function to load a sound file. When one visits the website for the first time, it gets stuck loading. If you open the console through developer tools you see …

---

## [P5.js Array: Multiple Objects getting Spliced instead of Single](https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317)

<div class="topic-metadata">

**Author:** [@devalladares](https://discourse.processing.org/u/devalladares)\
**Replies:** 1\
**Last updated:** [January 23, 2021, 11:32pm UTC](https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317 "2021-01-23T23:32:11Z")

</div>

I’m trying to create a moving array of decorative circles, and as soon as a circle moves off the edge of the screen I would like to remove it from the array. I have tried both splicing and filtering from the array – howe…

---

## [Cannot display an image](https://discourse.processing.org/t/cannot-display-an-image/27256)

<div class="topic-metadata">

**Author:** [@skypickle](https://discourse.processing.org/u/skypickle)\
**Replies:** 1\
**Last updated:** [January 21, 2021, 10:22pm UTC](https://discourse.processing.org/t/cannot-display-an-image/27256 "2021-01-21T22:22:40Z")

</div>

my html \<!doctype html\> \<html\> \<head\> \<script src="p5/p5.js"\>\</script\> \<script src="p5/addons/p5.dom.js"\>\</script\> \<script src="sketch4.js"\>\</script\> \</head\> \<body style="margin: 0; overflow: hidden;"\> …

---

## [Student can't see running code](https://discourse.processing.org/t/student-cant-see-running-code/27249)

<div class="topic-metadata">

**Author:** [@MrRuTech](https://discourse.processing.org/u/MrRuTech)\
**Replies:** 5\
**Last updated:** [January 21, 2021, 8:11pm UTC](https://discourse.processing.org/t/student-cant-see-running-code/27249 "2021-01-21T20:11:39Z")

</div>

Student using p5.js on laptop creates code, runs code but can’t see program running. Student sends me the link to their sketch and I can run and see the code. We have tried this on several devices and browsers but it sti…

---

## [Locate Showcase](https://discourse.processing.org/t/locate-showcase/27239)

<div class="topic-metadata">

**Author:** [@Rahulm2310](https://discourse.processing.org/u/Rahulm2310)\
**Replies:** 4\
**Last updated:** [January 20, 2021, 4:33pm UTC](https://discourse.processing.org/t/locate-showcase/27239 "2021-01-20T16:33:16Z")

</div>

Hello, Can someone help me locate the code for the latest p5.js showcase ?

---

## [Want to make changes in Get Started page on p5.js Website on my localhost which is rendered by grunt server](https://discourse.processing.org/t/want-to-make-changes-in-get-started-page-on-p5-js-website-on-my-localhost-which-is-rendered-by-grunt-server/27237)

<div class="topic-metadata">

**Author:** [@Shubham](https://discourse.processing.org/u/Shubham)\
**Replies:** 2\
**Last updated:** [January 20, 2021, 3:03pm UTC](https://discourse.processing.org/t/want-to-make-changes-in-get-started-page-on-p5-js-website-on-my-localhost-which-is-rendered-by-grunt-server/27237 "2021-01-20T15:03:52Z")

</div>

I am new to open source contribution and found some typo on Get Started page on the p5.js website but finding a problem to resolve it as these files are rendered by grunt server, and else in the src folder, I couldn’t fi…

---

## [Array has error every other object](https://discourse.processing.org/t/array-has-error-every-other-object/27068)

<div class="topic-metadata">

**Author:** [@georg2a](https://discourse.processing.org/u/georg2a)\
**Replies:** 6\
**Last updated:** [January 19, 2021, 8:48pm UTC](https://discourse.processing.org/t/array-has-error-every-other-object/27068 "2021-01-19T20:48:41Z")

</div>

hi, the array seems to not work for every other object; on the second click, another object is spawned even if the click is outside of the contains/bounds of the shape. thanks to anyone who takes the time to read/respo…

---

## [Printing delay of 500 millisecs between indices of a for loop iteration](https://discourse.processing.org/t/printing-delay-of-500-millisecs-between-indices-of-a-for-loop-iteration/27201)

<div class="topic-metadata">

**Author:** [@decentralizedmike](https://discourse.processing.org/u/decentralizedmike)\
**Replies:** 9\
**Last updated:** [January 19, 2021, 5:15pm UTC](https://discourse.processing.org/t/printing-delay-of-500-millisecs-between-indices-of-a-for-loop-iteration/27201 "2021-01-19T17:15:18Z")

</div>

Hi p5 pals! I am having trouble trying to print out text with a delay between each iteration of the for loop. Instead of printing all at once in realtime, I would like a 1/2 sec delay between each of the indices. I ha…

---

## [P5.js iframe not loading?](https://discourse.processing.org/t/p5-js-iframe-not-loading/27066)

<div class="topic-metadata">

**Author:** [@georg2a](https://discourse.processing.org/u/georg2a)\
**Replies:** 4\
**Last updated:** [January 19, 2021, 12:30am UTC](https://discourse.processing.org/t/p5-js-iframe-not-loading/27066 "2021-01-19T00:30:40Z")

</div>

hi, https://editor.p5js.org/georg2a/present/DjlxhZ2W6T i’ve embedded multiple p5.js files into a website and all have worked except the one above; it freezes on “Loading…” as it does on processing.org. i’m not sure why…

---

## [How can I draw buttons on Chart.js canvas?](https://discourse.processing.org/t/how-can-i-draw-buttons-on-chart-js-canvas/27180)

<div class="topic-metadata">

**Author:** [@RichardDL](https://discourse.processing.org/u/RichardDL)\
**Replies:** 0\
**Last updated:** [January 18, 2021, 10:21pm UTC](https://discourse.processing.org/t/how-can-i-draw-buttons-on-chart-js-canvas/27180 "2021-01-18T22:21:04Z")

</div>

Hi, I’m trying to use Chart.js, and my sketch.js has the simplest example from here. I want to put buttons on the chart e.g. previous and next. What I have is a second canvas below the chart with a single rect. How ca…

---

## [Using createFileInput() to load JSON files during runtime](https://discourse.processing.org/t/using-createfileinput-to-load-json-files-during-runtime/27149)

<div class="topic-metadata">

**Author:** [@polygonfuture](https://discourse.processing.org/u/polygonfuture)\
**Replies:** 1\
**Last updated:** [January 18, 2021, 2:00am UTC](https://discourse.processing.org/t/using-createfileinput-to-load-json-files-during-runtime/27149 "2021-01-18T02:00:40Z")

</div>

Hi all, Overview I am making a simple p5.js front-end for controlling some electro-mechanical displays. Its a simple drawing app with the ability to save a drawing out as JSON and load it back as JSON. The output JSON…

---

## [Mask image with Text](https://discourse.processing.org/t/mask-image-with-text/27122)

<div class="topic-metadata">

**Author:** [@anarts\_3](https://discourse.processing.org/u/anarts_3)\
**Replies:** 3\
**Last updated:** [January 17, 2021, 2:52pm UTC](https://discourse.processing.org/t/mask-image-with-text/27122 "2021-01-17T14:52:48Z")

</div>

Hello everyone! So, quick question, I want to mask a image with a string of text from the code, but I can’t seem to figure out how to mask with text… I’m trying to achieve something like this: When I search about thi…

---

## [How to add text into randomly generated bubbles](https://discourse.processing.org/t/how-to-add-text-into-randomly-generated-bubbles/26950)

<div class="topic-metadata">

**Author:** [@add2fic](https://discourse.processing.org/u/add2fic)\
**Replies:** 7\
**Last updated:** [January 17, 2021, 11:21am UTC](https://discourse.processing.org/t/how-to-add-text-into-randomly-generated-bubbles/26950 "2021-01-17T11:21:36Z")

</div>

I found and edited this open processing example, right now it is just creating random bubbles but I want text to appear at the center of these bubbles. For example an array n=\[‘A’,‘B’,‘C’\] and have them appear in the bub…

---

## [Add text into moving bubbles](https://discourse.processing.org/t/add-text-into-moving-bubbles/27128)

<div class="topic-metadata">

**Author:** [@add2fic](https://discourse.processing.org/u/add2fic)\
**Replies:** 1\
**Last updated:** [January 17, 2021, 11:16am UTC](https://discourse.processing.org/t/add-text-into-moving-bubbles/27128 "2021-01-17T11:16:01Z")

</div>

Hi! I’ve asked about this before but I’ve come to a place where I am a little stuck. I am trying to insert text into these generated bubbles that move and also get the text to move along with it. I don’t need the text to…

---

## [Sublime \> my P5.js sketch not running in localhost](https://discourse.processing.org/t/sublime-my-p5-js-sketch-not-running-in-localhost/27071)

<div class="topic-metadata">

**Author:** [@maneschka](https://discourse.processing.org/u/maneschka)\
**Replies:** 4\
**Last updated:** [January 17, 2021, 3:02am UTC](https://discourse.processing.org/t/sublime-my-p5-js-sketch-not-running-in-localhost/27071 "2021-01-17T03:02:29Z")

</div>

Hi! I just installed p5.js on my Laptop. However, when I run the code, it freezes and it shows only “loading” I’m working on windows. Does anyone know why? Thanks

---

## [Can't get smooth-moving p5 blur in Safari](https://discourse.processing.org/t/cant-get-smooth-moving-p5-blur-in-safari/11292)

<div class="topic-metadata">

**Author:** [@maxbatt](https://discourse.processing.org/u/maxbatt)\
**Replies:** 3\
**Last updated:** [January 16, 2021, 2:17pm UTC](https://discourse.processing.org/t/cant-get-smooth-moving-p5-blur-in-safari/11292 "2021-01-16T14:17:18Z")

</div>

Hello! First off - thanks in advance for help. I’m looking to create an ambient, almost blurred lava-lamp-like effect as exemplified in the design below: I decided to blur various circles, you can see the un-…

---

## [\[issue\] Hi can't find the problem in my code . I am new thanks](https://discourse.processing.org/t/issue-hi-cant-find-the-problem-in-my-code-i-am-new-thanks/27099)

<div class="topic-metadata">

**Author:** [@brono](https://discourse.processing.org/u/brono)\
**Replies:** 1\
**Last updated:** [January 15, 2021, 6:13pm UTC](https://discourse.processing.org/t/issue-hi-cant-find-the-problem-in-my-code-i-am-new-thanks/27099 "2021-01-15T18:13:44Z")

</div>

I was following The coding train video 7.4. link:: \> https://www.youtube.com/watch?v=fBqaA7zRO58&list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA&index=29&ab\_channel=TheCodingTrain and I can’t find the problem I am facing. it…

---

## [p5js in wordpress ](https://discourse.processing.org/t/p5js-in-wordpress/27093)

<div class="topic-metadata">

**Author:** [@sapperlot](https://discourse.processing.org/u/sapperlot)\
**Replies:** 0\
**Last updated:** [January 15, 2021, 2:52pm UTC](https://discourse.processing.org/t/p5js-in-wordpress/27093 "2021-01-15T14:52:13Z")

</div>

---

## [Stuck with replicating the mouseover function](https://discourse.processing.org/t/stuck-with-replicating-the-mouseover-function/27039)

<div class="topic-metadata">

**Author:** [@georg2a](https://discourse.processing.org/u/georg2a)\
**Replies:** 4\
**Last updated:** [January 14, 2021, 8:53am UTC](https://discourse.processing.org/t/stuck-with-replicating-the-mouseover-function/27039 "2021-01-14T08:53:49Z")

</div>

hello, i’m having some trouble constricting the box space that triggers a change in visuals. i’ve drawn an outline of the area i want the visuals/mouse to change within. as the cursor moves out of this box, it should ret…

---

## [Draw angle curve between two vectors](https://discourse.processing.org/t/draw-angle-curve-between-two-vectors/27033)

<div class="topic-metadata">

**Author:** [@sarath.jasrin](https://discourse.processing.org/u/sarath.jasrin)\
**Replies:** 1\
**Last updated:** [January 13, 2021, 10:49pm UTC](https://discourse.processing.org/t/draw-angle-curve-between-two-vectors/27033 "2021-01-13T22:49:45Z")

</div>

How to draw angle curve between two vectors like below pictures in p5js My current drawing looks like below Here is the example sketch: https://editor.p5js.org/sarathjasrin/sketches/EVFh7Ni3n Thanks in advance

---

## [Are there any release notes for p5 1.2.0?](https://discourse.processing.org/t/are-there-any-release-notes-for-p5-1-2-0/27008)

<div class="topic-metadata">

**Author:** [@grege2](https://discourse.processing.org/u/grege2)\
**Replies:** 0\
**Last updated:** [January 13, 2021, 5:42am UTC](https://discourse.processing.org/t/are-there-any-release-notes-for-p5-1-2-0/27008 "2021-01-13T05:42:58Z")

</div>

Hi, I just noticed there is a 1.2.0 release, from 20 Dec. I can’t see the usual Release/Contents notes, at https://github.com/processing/p5.js/releases or anywhere else. Is it just a roll-up bugfix release with nothing …

---

## [Do you have the missing media files from the p5.js Getting Started Book?](https://discourse.processing.org/t/do-you-have-the-missing-media-files-from-the-p5-js-getting-started-book/20445)

<div class="topic-metadata">

**Author:** [@mnoble](https://discourse.processing.org/u/mnoble)\
**Replies:** 3\
**Last updated:** [January 12, 2021, 8:57pm UTC](https://discourse.processing.org/t/do-you-have-the-missing-media-files-from-the-p5-js-getting-started-book/20445 "2021-01-12T20:57:53Z")

</div>

Hello Forum :slight\_smile: I have been looking all over the web for the missing data visualization media files from p5.js book. It is a known issue on Github without any results. Does any have the following missing fil…

---

## [Webpacking the p5 addons](https://discourse.processing.org/t/webpacking-the-p5-addons/18264)

<div class="topic-metadata">

**Author:** [@modestfool](https://discourse.processing.org/u/modestfool)\
**Replies:** 5\
**Last updated:** [January 12, 2021, 4:45pm UTC](https://discourse.processing.org/t/webpacking-the-p5-addons/18264 "2021-01-12T16:45:08Z")

</div>

Hi. I’m able to get p5 to render drawings, but I can’t get it to import sound addons. The inpector throughs the error: p5 is not defined (inside p5.sound.js:3112). My code is as follows: import p5 from './p5/p5' import…

---

## [Responsive canvas](https://discourse.processing.org/t/responsive-canvas/26983)

<div class="topic-metadata">

**Author:** [@seicaratteri](https://discourse.processing.org/u/seicaratteri)\
**Replies:** 5\
**Last updated:** [January 12, 2021, 10:36am UTC](https://discourse.processing.org/t/responsive-canvas/26983 "2021-01-12T10:36:18Z")

</div>

Hello all! I am very new with p5js, and as an exercise I created a very simple sketch that generates an abstract landscape based on a lot of lines tied to a vector field originated by perlin noise. I am trying to mak…

---

## [How to trigger P5js sketch with scroll](https://discourse.processing.org/t/how-to-trigger-p5js-sketch-with-scroll/26990)

<div class="topic-metadata">

**Author:** [@robert](https://discourse.processing.org/u/robert)\
**Replies:** 1\
**Last updated:** [January 12, 2021, 6:57am UTC](https://discourse.processing.org/t/how-to-trigger-p5js-sketch-with-scroll/26990 "2021-01-12T06:57:45Z")

</div>

please format code with \</\> button \* homework policy \* asking questions I am currently working on a project where I need to have multiple p5 sketches on the same page. For this, I am going to use p5 instance mode. Th…

---

## [Find new point based on relative angle and distance](https://discourse.processing.org/t/find-new-point-based-on-relative-angle-and-distance/26921)

<div class="topic-metadata">

**Author:** [@sarath.jasrin](https://discourse.processing.org/u/sarath.jasrin)\
**Replies:** 2\
**Last updated:** [January 11, 2021, 8:31pm UTC](https://discourse.processing.org/t/find-new-point-based-on-relative-angle-and-distance/26921 "2021-01-11T20:31:13Z")

</div>

Hi how to find the new point based on relative angle and distance in the graph system. My drawing looks like below Lets say when I change angle between two points (A and c…

---

## [How to use ml5js + face-api to do face recognition?](https://discourse.processing.org/t/how-to-use-ml5js-face-api-to-do-face-recognition/26985)

<div class="topic-metadata">

**Author:** [@stephanschulz](https://discourse.processing.org/u/stephanschulz)\
**Replies:** 0\
**Last updated:** [January 11, 2021, 7:48pm UTC](https://discourse.processing.org/t/how-to-use-ml5js-face-api-to-do-face-recognition/26985 "2021-01-11T19:48:33Z")

</div>

Hello. I know ml5js gives access to faceapi as this example shows: https://learn.ml5js.org/#/reference/face-api But this shows you how to use face detection - knowing if and where a face is. I am hoping to also do the…

---

## [Is there a way to use a native js function in p5?](https://discourse.processing.org/t/is-there-a-way-to-use-a-native-js-function-in-p5/26945)

<div class="topic-metadata">

**Author:** [@jgsantos](https://discourse.processing.org/u/jgsantos)\
**Replies:** 3\
**Last updated:** [January 10, 2021, 11:59am UTC](https://discourse.processing.org/t/is-there-a-way-to-use-a-native-js-function-in-p5/26945 "2021-01-10T11:59:18Z")

</div>

please format code with \</\> button \* homework policy \* asking questions Hi, i’am wondering if it is possible to use native js functions in p5. I need, for example, to use the element.scrollTop property, but i don’t k…

---

## [Sound glitch, without using sound](https://discourse.processing.org/t/sound-glitch-without-using-sound/26912)

<div class="topic-metadata">

**Author:** [@arismelachroinos](https://discourse.processing.org/u/arismelachroinos)\
**Replies:** 0\
**Last updated:** [January 9, 2021, 10:40am UTC](https://discourse.processing.org/t/sound-glitch-without-using-sound/26912 "2021-01-09T10:40:20Z")

</div>

Hi guys, something strange is happening sometimes when I launch a sketch with the p5 editor. I am pretty sure it has happened when launching the website manually (without using the editor). The thing is that this happen…

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

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