# p5.js

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

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

**Page:** 91

---

## [Adding multiple p5.js sketches with Angular 7](https://discourse.processing.org/t/adding-multiple-p5-js-sketches-with-angular-7/12150)

<div class="topic-metadata">

**Author:** [@thonpy](https://discourse.processing.org/u/thonpy)\
**Replies:** 2\
**Last updated:** [June 30, 2019, 9:11pm UTC](https://discourse.processing.org/t/adding-multiple-p5-js-sketches-with-angular-7/12150 "2019-06-30T21:11:17Z")

</div>

I am trying to make a website and in one page I am trying to integrate all my p5.js sketches into a single webpage. I have separate sketch.js files and I wanted to integrate it to the Angular project, any ideas on how to…

---

## [Object moves when .move function not called](https://discourse.processing.org/t/object-moves-when-move-function-not-called/12391)

<div class="topic-metadata">

**Author:** [@itch](https://discourse.processing.org/u/itch)\
**Replies:** 3\
**Last updated:** [June 30, 2019, 4:39pm UTC](https://discourse.processing.org/t/object-moves-when-move-function-not-called/12391 "2019-06-30T16:39:57Z")

</div>

Hello everyone, I’m attempting to simulate a light clock a la Einstein’s famous though experiment in p5. I’ve made mirror and photon objects, and have utilised those in a meta-object called “clock”. I want to have one…

---

## [Beginner Frequency Problem](https://discourse.processing.org/t/beginner-frequency-problem/12400)

<div class="topic-metadata">

**Author:** [@Sugallat](https://discourse.processing.org/u/Sugallat)\
**Replies:** 0\
**Last updated:** [June 30, 2019, 7:51am UTC](https://discourse.processing.org/t/beginner-frequency-problem/12400 "2019-06-30T07:51:56Z")

</div>

Hello! :slight\_smile: This is my first post. I’m working on a Frequency analyzer. The problem is that, when I sing G#4, it writes G#5 with wrong Herz. How should I fix this code? https://codepen.io/asinger/pen/pXWxZB …

---

## [How to Graph data from csv file?](https://discourse.processing.org/t/how-to-graph-data-from-csv-file/12388)

<div class="topic-metadata">

**Author:** [@RichardDL](https://discourse.processing.org/u/RichardDL)\
**Replies:** 2\
**Last updated:** [June 30, 2019, 12:19pm UTC](https://discourse.processing.org/t/how-to-graph-data-from-csv-file/12388 "2019-06-30T12:19:37Z")

</div>

Hi, I’ve made myself an application with a node.js server serial-connected to Arduino. The Arduino is collecting temperature data and the server sends it to a P5.js web-page and logs it to csv file. I’d like to show a…

---

## [How to use javascript libraries (e.g. gauge.js)](https://discourse.processing.org/t/how-to-use-javascript-libraries-e-g-gauge-js/12393)

<div class="topic-metadata">

**Author:** [@demket](https://discourse.processing.org/u/demket)\
**Replies:** 3\
**Last updated:** [June 30, 2019, 2:02am UTC](https://discourse.processing.org/t/how-to-use-javascript-libraries-e-g-gauge-js/12393 "2019-06-30T02:02:38Z")

</div>

Hi, is it possible to use external javascript libraries like gauge.js? I’ve added the p5.dom.min.js file in a similar way to the Gauge.min.js file, but it doesn’t work. Thanks

---

## [What is the difference between pixelDensity() and displayDensity()?](https://discourse.processing.org/t/what-is-the-difference-between-pixeldensity-and-displaydensity/12381)

<div class="topic-metadata">

**Author:** [@matias.silva](https://discourse.processing.org/u/matias.silva)\
**Replies:** 2\
**Last updated:** [June 29, 2019, 2:31pm UTC](https://discourse.processing.org/t/what-is-the-difference-between-pixeldensity-and-displaydensity/12381 "2019-06-29T14:31:36Z")

</div>

Hey! I’ve started to use p5.Graphics in my sketches and ran into a problem with pixel densities. I’m familiar with p5 and Processing but can’t quite grasp the meaning of these two functions and how they differ. Also, wh…

---

## [Time line without Flash](https://discourse.processing.org/t/time-line-without-flash/12037)

<div class="topic-metadata">

**Author:** [@Thiru](https://discourse.processing.org/u/Thiru)\
**Replies:** 20\
**Last updated:** [June 29, 2019, 12:24pm UTC](https://discourse.processing.org/t/time-line-without-flash/12037 "2019-06-29T12:24:47Z")

</div>

Hi, I have basic knowledge of programming. After doing a bit of research, it looks like the timeline shown in this link can be done in HTML, Canvas, JS,… (without adobe flash). I would very much appreciate if you wo…

---

## [Why is p5.js preload so slow?](https://discourse.processing.org/t/why-is-p5-js-preload-so-slow/12176)

<div class="topic-metadata">

**Author:** [@clankill3r](https://discourse.processing.org/u/clankill3r)\
**Replies:** 3\
**Last updated:** [June 29, 2019, 10:39am UTC](https://discourse.processing.org/t/why-is-p5-js-preload-so-slow/12176 "2019-06-29T10:39:53Z")

</div>

I load a few mp3 files that are 2 minutes long. function preload() { sound\_dancer\_1\_l = loadSound('data/GH010103\_1-L.mp3'); sound\_dancer\_1\_r = loadSound('data/GH010103\_1-R.mp3'); sound\_dancer\_2\_l = loadSound('data/…

---

## [How to use tint() with copy()](https://discourse.processing.org/t/how-to-use-tint-with-copy/12359)

<div class="topic-metadata">

**Author:** [@TheWizardBear](https://discourse.processing.org/u/TheWizardBear)\
**Replies:** 7\
**Last updated:** [June 28, 2019, 6:05pm UTC](https://discourse.processing.org/t/how-to-use-tint-with-copy/12359 "2019-06-28T18:05:13Z")

</div>

To put a tint on an image you use the tint function followed by the image function like so: tint(255, 0, 0); image(img, 0, 0); //red image But when I try to use the copy function, the tint isn’t applied as it is only e…

---

## [Unwanted scrollbar showing because of canvas](https://discourse.processing.org/t/unwanted-scrollbar-showing-because-of-canvas/12214)

<div class="topic-metadata">

**Author:** [@Halhex](https://discourse.processing.org/u/Halhex)\
**Replies:** 8\
**Last updated:** [June 28, 2019, 5:51pm UTC](https://discourse.processing.org/t/unwanted-scrollbar-showing-because-of-canvas/12214 "2019-06-28T17:51:27Z")

</div>

I am creating a simple p5.js canvas using the values from it’s parent, which takes up exactly half the screen. When I add the canvas which has the exact size as my html , body and #musicscape elements, a vertical scr…

---

## [Are slide pages possible with p5js?](https://discourse.processing.org/t/are-slide-pages-possible-with-p5js/12341)

<div class="topic-metadata">

**Author:** [@umt](https://discourse.processing.org/u/umt)\
**Replies:** 0\
**Last updated:** [June 27, 2019, 2:05pm UTC](https://discourse.processing.org/t/are-slide-pages-possible-with-p5js/12341 "2019-06-27T14:05:28Z")

</div>

Hi guys, I want to make like slide with p5js canvas arrays. If previous and next buttons clicks change the canvas on screen. Finally ı want to export all pages( all canvas) to pdf . Is it possible?

---

## [Copying a color](https://discourse.processing.org/t/copying-a-color/12312)

<div class="topic-metadata">

**Author:** [@marcusround](https://discourse.processing.org/u/marcusround)\
**Replies:** 4\
**Last updated:** [June 27, 2019, 9:08am UTC](https://discourse.processing.org/t/copying-a-color/12312 "2019-06-27T09:08:52Z")

</div>

Is this the best/most succinct way of copying a color? c2 = color( red(c1), green(c1), blue(c1), alpha(c1) ) I wish I could just do c2 = c1.copy() or something like that, which you can do with vectors.

---

## [If else statement not working](https://discourse.processing.org/t/if-else-statement-not-working/12325)

<div class="topic-metadata">

**Author:** [@julan](https://discourse.processing.org/u/julan)\
**Replies:** 2\
**Last updated:** [June 27, 2019, 6:04am UTC](https://discourse.processing.org/t/if-else-statement-not-working/12325 "2019-06-27T06:04:20Z")

</div>

hey, I am a beginner and wanted to made this sketch of a ball that squishes before it bounces back, hover it doesn’t squisches at al and I don’t get the squishing part of the sketch to work without removing all of the m…

---

## [Help: what am I missing?](https://discourse.processing.org/t/help-what-am-i-missing/12241)

<div class="topic-metadata">

**Author:** [@PixelMx](https://discourse.processing.org/u/PixelMx)\
**Replies:** 3\
**Last updated:** [June 26, 2019, 9:29pm UTC](https://discourse.processing.org/t/help-what-am-i-missing/12241 "2019-06-26T21:29:03Z")

</div>

hello everyone. I’ve been asking a lot of questions lately, I’m learning to code by copying. Last night I found a sketch in openprocessing that I liked that it was created with P5, I thought translating was a good exerc…

---

## [Pause Line Execution Until Condition Happens in P5](https://discourse.processing.org/t/pause-line-execution-until-condition-happens-in-p5/11910)

<div class="topic-metadata">

**Author:** [@zinsy23](https://discourse.processing.org/u/zinsy23)\
**Replies:** 9\
**Last updated:** [June 25, 2019, 11:24am UTC](https://discourse.processing.org/t/pause-line-execution-until-condition-happens-in-p5/11910 "2019-06-25T11:24:33Z")

</div>

I am making an abacus simulator in p5 (sketch file) that does all the moves step by step. To animate the movement, I have variable x incrementally increase/decrease in a show function I created (lines 166 and 172), which…

---

## [Mobile examples with accelerationX are not working?](https://discourse.processing.org/t/mobile-examples-with-accelerationx-are-not-working/11122)

<div class="topic-metadata">

**Author:** [@RichardDL](https://discourse.processing.org/u/RichardDL)\
**Replies:** 3\
**Last updated:** [June 22, 2019, 3:18pm UTC](https://discourse.processing.org/t/mobile-examples-with-accelerationx-are-not-working/11122 "2019-06-22T15:18:11Z")

</div>

Hi, A few weeks ago the mobile example ex03\_shake\_ballBounce was working well for me, and I’d made a version with coloured balls. Today the accelerationX and Y are returning zero. A few days ago I updated to P5.JS 1.…

---

## [Creating a grid of toggle buttons](https://discourse.processing.org/t/creating-a-grid-of-toggle-buttons/12162)

<div class="topic-metadata">

**Author:** [@Col\_John\_Matrix](https://discourse.processing.org/u/Col_John_Matrix)\
**Replies:** 4\
**Last updated:** [June 21, 2019, 7:59am UTC](https://discourse.processing.org/t/creating-a-grid-of-toggle-buttons/12162 "2019-06-21T07:59:06Z")

</div>

Hello, I wish to create a GUI to control the ON/OFF state of an 8 by 8 array of LEDs. What I’d like the GUI to look like would be an 8 by 8 array of toggle buttons, one for each LED, to toggle each LED ON/OFF accordingl…

---

## [P5.js Object array of title names are not being recognized](https://discourse.processing.org/t/p5-js-object-array-of-title-names-are-not-being-recognized/12224)

<div class="topic-metadata">

**Author:** [@debxyz](https://discourse.processing.org/u/debxyz)\
**Replies:** 4\
**Last updated:** [June 21, 2019, 5:57am UTC](https://discourse.processing.org/t/p5-js-object-array-of-title-names-are-not-being-recognized/12224 "2019-06-21T05:57:05Z")

</div>

Before adding the stars I’m trying to figure out why the titles are not appearing on the book objects. I’m sure it’s a simple oversight on my part, but if anyone can help it is sincerely appreciated! var myBooks = \[ { …

---

## [Input Field and Button not working in android mobile](https://discourse.processing.org/t/input-field-and-button-not-working-in-android-mobile/12203)

<div class="topic-metadata">

**Author:** [@Kabir](https://discourse.processing.org/u/Kabir)\
**Replies:** 0\
**Last updated:** [June 20, 2019, 2:00pm UTC](https://discourse.processing.org/t/input-field-and-button-not-working-in-android-mobile/12203 "2019-06-20T14:00:59Z")

</div>

I made a github page of my p5.js sketches. Some of my programs required text input from the user. So I used createInput() and createButton() function like in this one https://road-coders.github.io/Factorial/index.html. I…

---

## [Is this a bug, if statement validation Djikstra](https://discourse.processing.org/t/is-this-a-bug-if-statement-validation-djikstra/12184)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 7\
**Last updated:** [June 19, 2019, 9:21pm UTC](https://discourse.processing.org/t/is-this-a-bug-if-statement-validation-djikstra/12184 "2019-06-19T21:21:40Z")

</div>

I’m coding a djiktsra search algorithm however I wanted to improve the last bit my programs algorithm and again run into some if statement issues, not sure if this is a bug or not. https://editor.p5js.org/paulgoux/sketc…

---

## [P5.js in React Native](https://discourse.processing.org/t/p5-js-in-react-native/12181)

<div class="topic-metadata">

**Author:** [@boyswan](https://discourse.processing.org/u/boyswan)\
**Replies:** 2\
**Last updated:** [June 19, 2019, 2:16pm UTC](https://discourse.processing.org/t/p5-js-in-react-native/12181 "2019-06-19T14:16:52Z")

</div>

Has anyone successfully got p5.js (instanced mode) working in React Native? I’ve stumbled across this which works, however it’s using processing.js rather than p5. The main issue I’m struggling with is p5’s browser/win…

---

## [P5.js with Divi in wordpress?](https://discourse.processing.org/t/p5-js-with-divi-in-wordpress/12148)

<div class="topic-metadata">

**Author:** [@othernode](https://discourse.processing.org/u/othernode)\
**Replies:** 1\
**Last updated:** [June 18, 2019, 2:25pm UTC](https://discourse.processing.org/t/p5-js-with-divi-in-wordpress/12148 "2019-06-18T14:25:04Z")

</div>

Hi guys, I am looking for a way to use p5.js inside the Divi builder in wordpress. does anyone have an idea if this would be possible and how to go about it? Thanks!

---

## [Help understanding properties](https://discourse.processing.org/t/help-understanding-properties/12108)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 1\
**Last updated:** [June 17, 2019, 8:34pm UTC](https://discourse.processing.org/t/help-understanding-properties/12108 "2019-06-17T20:34:17Z")

</div>

I’m trying to understand the behavior of properties in this function. I’ve created entirely by accident, or rather I have not read any documentation prior to coding this. I know vaguely how properties work, but the behav…

---

## [Html contdown timer](https://discourse.processing.org/t/html-contdown-timer/12123)

<div class="topic-metadata">

**Author:** [@Elite](https://discourse.processing.org/u/Elite)\
**Replies:** 1\
**Last updated:** [June 17, 2019, 8:31pm UTC](https://discourse.processing.org/t/html-contdown-timer/12123 "2019-06-17T20:31:29Z")

</div>

Hello, i want to set a timer on my html website that can use a selected value as the counter value, i created a js code that runs the timer but everytime i reload it, it runs the timer again. HTML \<select name="ddsele…

---

## [Understanding paint depth & opacity in p5js & webgl](https://discourse.processing.org/t/understanding-paint-depth-opacity-in-p5js-webgl/12046)

<div class="topic-metadata">

**Author:** [@jedierikb](https://discourse.processing.org/u/jedierikb)\
**Replies:** 2\
**Last updated:** [June 15, 2019, 5:58pm UTC](https://discourse.processing.org/t/understanding-paint-depth-opacity-in-p5js-webgl/12046 "2019-06-15T17:58:15Z")

</div>

https://codepen.io/jedierikb/pen/EBVyPE?editors=1010 In this example, I am confused that the green plane is over the red plane when on the right side of the sketch. If I change the opacity of the planes to 100%, then I…

---

## [How to use mousePressed with mouseX and mouseY?](https://discourse.processing.org/t/how-to-use-mousepressed-with-mousex-and-mousey/12000)

<div class="topic-metadata">

**Author:** [@carriemarrie](https://discourse.processing.org/u/carriemarrie)\
**Replies:** 2\
**Last updated:** [June 14, 2019, 11:02pm UTC](https://discourse.processing.org/t/how-to-use-mousepressed-with-mousex-and-mousey/12000 "2019-06-14T23:02:40Z")

</div>

I have 6 different objects and I’d like to choose one of the objects and move it to the next screen. Right now there is just 3D box on the next screen. But I don’t know how to do it. Any help would be needed! Here’s the…

---

## [Issues with panning & checking for visibility on a translated canvas?](https://discourse.processing.org/t/issues-with-panning-checking-for-visibility-on-a-translated-canvas/12006)

<div class="topic-metadata">

**Author:** [@Tinstar](https://discourse.processing.org/u/Tinstar)\
**Replies:** 2\
**Last updated:** [June 14, 2019, 7:06pm UTC](https://discourse.processing.org/t/issues-with-panning-checking-for-visibility-on-a-translated-canvas/12006 "2019-06-14T19:06:14Z")

</div>

I originally posted this on Stack Overflow via the p5 tag, but figured this might be a better place for it. I’m working on getting 2D zooming and panning working in a p5 project, a la this example code. I’m working in i…

---

## [How to use split screen video sections as textures?](https://discourse.processing.org/t/how-to-use-split-screen-video-sections-as-textures/11463)

<div class="topic-metadata">

**Author:** [@jedierikb](https://discourse.processing.org/u/jedierikb)\
**Replies:** 3\
**Last updated:** [June 13, 2019, 4:54pm UTC](https://discourse.processing.org/t/how-to-use-split-screen-video-sections-as-textures/11463 "2019-06-13T16:54:34Z")

</div>

Here is what I am trying to do: load one split screen video (for example https://www.youtube.com/watch?v=5eEXKzbeH7c ) and then use either side of the video as a texture for two different GL shapes. Hoping the community…

---

## [Mouse relative to Translations and Scale](https://discourse.processing.org/t/mouse-relative-to-translations-and-scale/11976)

<div class="topic-metadata">

**Author:** [@oOoOoO](https://discourse.processing.org/u/oOoOoO)\
**Replies:** 2\
**Last updated:** [June 12, 2019, 6:29pm UTC](https://discourse.processing.org/t/mouse-relative-to-translations-and-scale/11976 "2019-06-12T18:29:57Z")

</div>

Hello. I am trying to access the mouse position through mouseX and mouseY within a keypressed function, but I have translations and scales in the draw function of my sketch, and I think this is causing me to get a mouse …

---

## [Trying to create wave / cloth flow pattern](https://discourse.processing.org/t/trying-to-create-wave-cloth-flow-pattern/11795)

<div class="topic-metadata">

**Author:** [@noob](https://discourse.processing.org/u/noob)\
**Replies:** 10\
**Last updated:** [June 12, 2019, 2:37am UTC](https://discourse.processing.org/t/trying-to-create-wave-cloth-flow-pattern/11795 "2019-06-12T02:37:46Z")

</div>

Hello good people! I found this picture in the internet few weeks ago: and I have been trying to replicate this in p5.js but haven’t found the solution yet. This is my code: var woll = \[\]; function setup() { cre…

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

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