# p5.js

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

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

**Page:** 92

---

## [Change shape of color brightness](https://discourse.processing.org/t/change-shape-of-color-brightness/11030)

<div class="topic-metadata">

**Author:** [@hamzakhan](https://discourse.processing.org/u/hamzakhan)\
**Replies:** 4\
**Last updated:** [June 10, 2019, 11:33am UTC](https://discourse.processing.org/t/change-shape-of-color-brightness/11030 "2019-06-10T11:33:41Z")

</div>

How we can change shape of color brightness of below tutorial ? https://p5js.org/examples/color-brightness.html

---

## [Tentacles renders on polar to cartersian all out of whack](https://discourse.processing.org/t/tentacles-renders-on-polar-to-cartersian-all-out-of-whack/11957)

<div class="topic-metadata">

**Author:** [@Arif](https://discourse.processing.org/u/Arif)\
**Replies:** 1\
**Last updated:** [June 10, 2019, 6:22am UTC](https://discourse.processing.org/t/tentacles-renders-on-polar-to-cartersian-all-out-of-whack/11957 "2019-06-10T06:22:26Z")

</div>

Hey There, I just recently found p5.js and have gone through a whole bunch of tutorial videos by Daniel Shiffman. I have managed to Frankenstein this together. My goal is to have the tentacles hang on the vertices of t…

---

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

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 3\
**Last updated:** [June 9, 2019, 7:47pm UTC](https://discourse.processing.org/t/if-else-statement-not-evaluating/11927 "2019-06-09T19:47:05Z")

</div>

I’m trying to automate the maze search I’ve created (I know I keep posting about this one). So weird issue, I need to test if the paths have been explored so I created a variable that can be updated every time there is n…

---

## [Problem with socket.io](https://discourse.processing.org/t/problem-with-socket-io/11907)

<div class="topic-metadata">

**Author:** [@LittleBoxes](https://discourse.processing.org/u/LittleBoxes)\
**Replies:** 4\
**Last updated:** [June 9, 2019, 4:22pm UTC](https://discourse.processing.org/t/problem-with-socket-io/11907 "2019-06-09T16:22:34Z")

</div>

Hello, II would like to use socket.io to create a small multiplayer game. To try this lib, I try to install a Shared-canvas script found on the Coding Train site (tuto about websocket). It works well on a local server …

---

## [Render SVG in P5.js](https://discourse.processing.org/t/render-svg-in-p5-js/11935)

<div class="topic-metadata">

**Author:** [@Alexandra](https://discourse.processing.org/u/Alexandra)\
**Replies:** 5\
**Last updated:** [June 9, 2019, 11:27am UTC](https://discourse.processing.org/t/render-svg-in-p5-js/11935 "2019-06-09T11:27:57Z")

</div>

Hi everyone! I’m checking out the graphics/shapes examples in P5 and found out that they are all raster-based. I’m wondering whether there’s a way to render SVG files inside P5. Thanks! Alexandra

---

## [Need help! Beginner! How to capture image and use the image](https://discourse.processing.org/t/need-help-beginner-how-to-capture-image-and-use-the-image/11937)

<div class="topic-metadata">

**Author:** [@carriemarrie](https://discourse.processing.org/u/carriemarrie)\
**Replies:** 1\
**Last updated:** [June 9, 2019, 7:38am UTC](https://discourse.processing.org/t/need-help-beginner-how-to-capture-image-and-use-the-image/11937 "2019-06-09T07:38:26Z")

</div>

Hello! I am trying to make an app for my first coding course but I am having some problems. By far I have made the first page, using camera and saving the picture. But my next step would be to USE the image that I took a…

---

## [Code Circular Heat map with P5](https://discourse.processing.org/t/code-circular-heat-map-with-p5/10561)

<div class="topic-metadata">

**Author:** [@bram94](https://discourse.processing.org/u/bram94)\
**Replies:** 6\
**Last updated:** [June 8, 2019, 9:47pm UTC](https://discourse.processing.org/t/code-circular-heat-map-with-p5/10561 "2019-06-08T21:47:52Z")

</div>

Hi all, I am very new to P5 and want to code a circular heatmap inP5 based on data I have Something similar like shown in the figure. I already manage to do it in R, but really need to do it in p5 and already unsuces…

---

## [Using splice in an enhanced for loop](https://discourse.processing.org/t/using-splice-in-an-enhanced-for-loop/11931)

<div class="topic-metadata">

**Author:** [@ZachMcMkay](https://discourse.processing.org/u/ZachMcMkay)\
**Replies:** 1\
**Last updated:** [June 8, 2019, 8:26pm UTC](https://discourse.processing.org/t/using-splice-in-an-enhanced-for-loop/11931 "2019-06-08T20:26:20Z")

</div>

Is there an issue with splice not working properly when running an enhanced for loop? this is my code. for (p of pieces) { for (other of pieces) { if (p != other && p.col != other.col && p.capture(other)) { co…

---

## [Neophyte needs help converting P5 code to Processing](https://discourse.processing.org/t/neophyte-needs-help-converting-p5-code-to-processing/11884)

<div class="topic-metadata">

**Author:** [@lfb](https://discourse.processing.org/u/lfb)\
**Replies:** 12\
**Last updated:** [June 8, 2019, 7:24pm UTC](https://discourse.processing.org/t/neophyte-needs-help-converting-p5-code-to-processing/11884 "2019-06-08T19:24:16Z")

</div>

Hello, friends. I have a small P5 sketch that I want to convert to Processing. I’ve tried, I’ve tried but can’t bring it home. Getting frustrated. The problem happens mainly in one function that converts a string of 12 c…

---

## [Image not loading](https://discourse.processing.org/t/image-not-loading/11892)

<div class="topic-metadata">

**Author:** [@CodingIsLife](https://discourse.processing.org/u/CodingIsLife)\
**Replies:** 8\
**Last updated:** [June 8, 2019, 7:54am UTC](https://discourse.processing.org/t/image-not-loading/11892 "2019-06-08T07:54:31Z")

</div>

I loaded a local image in the preload() function. When I opened the sketch in chrome it says Loading… and in the console it says some weird message - access to image at is from origin ‘null’ has been blocked by CORS po…

---

## [Dragging and dropping an object](https://discourse.processing.org/t/dragging-and-dropping-an-object/11917)

<div class="topic-metadata">

**Author:** [@ZachMcMkay](https://discourse.processing.org/u/ZachMcMkay)\
**Replies:** 2\
**Last updated:** [June 8, 2019, 7:22am UTC](https://discourse.processing.org/t/dragging-and-dropping-an-object/11917 "2019-06-08T07:22:12Z")

</div>

Hello! im trying to create a game where i can pick up a piece move it and then drop it where i want. I’ve run into a wall trying to logically think about dropping the piece. in order to pick it up and move it by having…

---

## [Missing createSlider() from reference page](https://discourse.processing.org/t/missing-createslider-from-reference-page/11855)

<div class="topic-metadata">

**Author:** [@tyler\_harris](https://discourse.processing.org/u/tyler_harris)\
**Replies:** 3\
**Last updated:** [June 8, 2019, 4:54am UTC](https://discourse.processing.org/t/missing-createslider-from-reference-page/11855 "2019-06-08T04:54:04Z")

</div>

the documentation page https://p5js.org/reference/#/p5/createSlider link is missing from https://p5js.org/reference/

---

## [P5.js vs javascript](https://discourse.processing.org/t/p5-js-vs-javascript/11866)

<div class="topic-metadata">

**Author:** [@CodingIsLife](https://discourse.processing.org/u/CodingIsLife)\
**Replies:** 5\
**Last updated:** [June 7, 2019, 4:26pm UTC](https://discourse.processing.org/t/p5-js-vs-javascript/11866 "2019-06-07T16:26:13Z")

</div>

I started p5.js recently. I never learnt javascript (the main javascript) at all. I have been learning only p5.js for almost 5 months… But I always had a question in my mind that - “I have not learnt javascript. Can p5.…

---

## [Printable graphic needed: Processed graphic doesn't fit canvas (SVG export doesn't work as either)](https://discourse.processing.org/t/printable-graphic-needed-processed-graphic-doesnt-fit-canvas-svg-export-doesnt-work-as-either/11861)

<div class="topic-metadata">

**Author:** [@optimaprima](https://discourse.processing.org/u/optimaprima)\
**Replies:** 8\
**Last updated:** [June 7, 2019, 9:35am UTC](https://discourse.processing.org/t/printable-graphic-needed-processed-graphic-doesnt-fit-canvas-svg-export-doesnt-work-as-either/11861 "2019-06-07T09:35:22Z")

</div>

Hi there, I am totally new to p5.js and I need this for my master thesis. I had this concept for a book that has some illustrations made with generated design. For example this code. Maybe someone can help to fit this…

---

## [Why does lightFalloff affect ambient lights?](https://discourse.processing.org/t/why-does-lightfalloff-affect-ambient-lights/11887)

<div class="topic-metadata">

**Author:** [@sanketsingh24](https://discourse.processing.org/u/sanketsingh24)\
**Replies:** 1\
**Last updated:** [June 6, 2019, 9:31pm UTC](https://discourse.processing.org/t/why-does-lightfalloff-affect-ambient-lights/11887 "2019-06-06T21:31:26Z")

</div>

Hello Everyone! I just had a doubt while I was implementing lightFalloff() in p5.js. Why does ambient light is affected by falloff? Because according to my understanding, ambient light is like fixed-intensity and omnidi…

---

## [Need help with texture](https://discourse.processing.org/t/need-help-with-texture/11881)

<div class="topic-metadata">

**Author:** [@Sudev](https://discourse.processing.org/u/Sudev)\
**Replies:** 0\
**Last updated:** [June 6, 2019, 11:57am UTC](https://discourse.processing.org/t/need-help-with-texture/11881 "2019-06-06T11:57:01Z")

</div>

Is there a way to repeat and offset the texture for 2d primitive shapes in WEBGL mode ? Right now I can only think of creating texture using createGraphics and applying offset in it.

---

## [P5.js to Processing conversion](https://discourse.processing.org/t/p5-js-to-processing-conversion/11789)

<div class="topic-metadata">

**Author:** [@camiloegea](https://discourse.processing.org/u/camiloegea)\
**Replies:** 2\
**Last updated:** [June 5, 2019, 9:24pm UTC](https://discourse.processing.org/t/p5-js-to-processing-conversion/11789 "2019-06-05T21:24:27Z")

</div>

Hi everyone, i´m new to java and i´m trying to convert this js code to processing, because I want it to interact with the OpenKinect Library: var img, car; function preload() { img = loadImage('faustocartel.png'); } …

---

## [Porting p5.processing Arraylist question](https://discourse.processing.org/t/porting-p5-processing-arraylist-question/11869)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 3\
**Last updated:** [June 5, 2019, 6:35pm UTC](https://discourse.processing.org/t/porting-p5-processing-arraylist-question/11869 "2019-06-05T18:35:36Z")

</div>

I’m trying to port over some code, from p5 ( this is the second environment I’ve learned to code in, the first being Khan academy). So I don’t understand all the concepts that Java utilises. However what seems like a sim…

---

## [Webgl, Rotate object from different rotation origin?](https://discourse.processing.org/t/webgl-rotate-object-from-different-rotation-origin/11765)

<div class="topic-metadata">

**Author:** [@KeirMeDear](https://discourse.processing.org/u/KeirMeDear)\
**Replies:** 6\
**Last updated:** [June 5, 2019, 5:25pm UTC](https://discourse.processing.org/t/webgl-rotate-object-from-different-rotation-origin/11765 "2019-06-05T17:25:11Z")

</div>

Is there a way in P5.js to rotate an object by an origin other than 0,0. For example, if I was making a human character, it it a way I would be able to rotate their arm from the shoulder joint instead of just the center…

---

## [How to pass React prop into setup()?](https://discourse.processing.org/t/how-to-pass-react-prop-into-setup/11849)

<div class="topic-metadata">

**Author:** [@venn](https://discourse.processing.org/u/venn)\
**Replies:** 4\
**Last updated:** [June 5, 2019, 7:28am UTC](https://discourse.processing.org/t/how-to-pass-react-prop-into-setup/11849 "2019-06-05T07:28:41Z")

</div>

Hi legends, I’m trying to figure out a problem with combining React UI with p5.js Currently I’m using p5-react-wrapper. I do aware @atoro has a more advanced and elegant solution (but it’s currently too complicated) fo…

---

## [Some problems with sound](https://discourse.processing.org/t/some-problems-with-sound/11833)

<div class="topic-metadata">

**Author:** [@Dolivan](https://discourse.processing.org/u/Dolivan)\
**Replies:** 2\
**Last updated:** [June 4, 2019, 10:46pm UTC](https://discourse.processing.org/t/some-problems-with-sound/11833 "2019-06-04T22:46:04Z")

</div>

Hi! This is my sketch. https://editor.p5js.org/Dolivan/sketches/QQznxnFsQ I have some problems about Audio In, delay process and reverb process. I hope you help me. Bye.

---

## [Help building a superorganism](https://discourse.processing.org/t/help-building-a-superorganism/11799)

<div class="topic-metadata">

**Author:** [@mcintyre](https://discourse.processing.org/u/mcintyre)\
**Replies:** 1\
**Last updated:** [June 3, 2019, 11:38pm UTC](https://discourse.processing.org/t/help-building-a-superorganism/11799 "2019-06-03T23:38:20Z")

</div>

Hey y’all, I’m trying to superimpose bodies detected by different webcams onto the same canvas, creating a sort of superorganism. The prototype is built with p5.js, ml5.js, React (thanks @atoro), and Meteor. The interac…

---

## [How to adapt a library for Instance Mode (P5JS)](https://discourse.processing.org/t/how-to-adapt-a-library-for-instance-mode-p5js/11775)

<div class="topic-metadata">

**Author:** [@FreddieRa](https://discourse.processing.org/u/FreddieRa)\
**Replies:** 7\
**Last updated:** [June 3, 2019, 9:23pm UTC](https://discourse.processing.org/t/how-to-adapt-a-library-for-instance-mode-p5js/11775 "2019-06-03T21:23:12Z")

</div>

Hi there, I have already written the p5.3D library, for adding 3D text and images into WebGL, but currently this only works for Global Mode. I’m not sure exactly what needs to be done, or how it needs to be reformatted…

---

## [When can you use cos and sin outside of setup or draw](https://discourse.processing.org/t/when-can-you-use-cos-and-sin-outside-of-setup-or-draw/11805)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 4\
**Last updated:** [June 3, 2019, 6:22pm UTC](https://discourse.processing.org/t/when-can-you-use-cos-and-sin-outside-of-setup-or-draw/11805 "2019-06-03T18:22:42Z")

</div>

Is there any instances where you can do this. So far I understand that you can create a function outside of setup or draw which contain cos or sin, but they have to be called in draw or setup to work or it will give you …

---

## [FFT in p5.js p5.sound](https://discourse.processing.org/t/fft-in-p5-js-p5-sound/8265)

<div class="topic-metadata">

**Author:** [@srinivas](https://discourse.processing.org/u/srinivas)\
**Replies:** 4\
**Last updated:** [June 3, 2019, 1:06pm UTC](https://discourse.processing.org/t/fft-in-p5-js-p5-sound/8265 "2019-06-03T13:06:05Z")

</div>

How is FFT done in p5.sound… i need fft Algorithm of p5.FFT .please…

---

## [Run P5 from the command line?](https://discourse.processing.org/t/run-p5-from-the-command-line/11641)

<div class="topic-metadata">

**Author:** [@lfb](https://discourse.processing.org/u/lfb)\
**Replies:** 2\
**Last updated:** [June 2, 2019, 7:37pm UTC](https://discourse.processing.org/t/run-p5-from-the-command-line/11641 "2019-06-02T19:37:26Z")

</div>

Hello friends. First post. I’d like to create sketches that take hours to produce an image that can then be written out to an image file. I’d like to run this from the command line and let it run overnight. How? I can ru…

---

## [How to add libraries to p5 Web editor?](https://discourse.processing.org/t/how-to-add-libraries-to-p5-web-editor/11769)

<div class="topic-metadata">

**Author:** [@TurboFanny](https://discourse.processing.org/u/TurboFanny)\
**Replies:** 1\
**Last updated:** [June 2, 2019, 9:17am UTC](https://discourse.processing.org/t/how-to-add-libraries-to-p5-web-editor/11769 "2019-06-02T09:17:18Z")

</div>

I am new to using p5 and am struggling to find out how to add libraries to the web editor. :upside\_down\_face::upside\_down\_face:

---

## [Using clear() correctly, Magic Leap Example](https://discourse.processing.org/t/using-clear-correctly-magic-leap-example/11747)

<div class="topic-metadata">

**Author:** [@Zevensuy](https://discourse.processing.org/u/Zevensuy)\
**Replies:** 1\
**Last updated:** [June 2, 2019, 6:04am UTC](https://discourse.processing.org/t/using-clear-correctly-magic-leap-example/11747 "2019-06-02T06:04:57Z")

</div>

Hi all, I am working on some examples of using p5js with the Magic Leap One Headset. The Magic Leap comes built in with its own browser called Helios. One of the “tricks” that the browser can do is set basically a transp…

---

## [How do the p5.js preload functions work?](https://discourse.processing.org/t/how-do-the-p5-js-preload-functions-work/3767)

<div class="topic-metadata">

**Author:** [@FirstProphet](https://discourse.processing.org/u/FirstProphet)\
**Replies:** 6\
**Last updated:** [June 1, 2019, 7:48pm UTC](https://discourse.processing.org/t/how-do-the-p5-js-preload-functions-work/3767 "2019-06-01T19:48:28Z")

</div>

I’m just interested in how it was implemented that functions like loadFont() or loadImage() can be called with a callback or in the preload function. How does p5.js know, when preload is done and when it is save to call …

---

## [Help, with projectile motion in game](https://discourse.processing.org/t/help-with-projectile-motion-in-game/11760)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 3\
**Last updated:** [June 1, 2019, 7:16pm UTC](https://discourse.processing.org/t/help-with-projectile-motion-in-game/11760 "2019-06-01T19:16:56Z")

</div>

I’m making a game with a digger, at the moment I’ve added a fire mechanism which shoots little projectile, this was just a test to see if I could code it. It works however I do not understand how to adjust for the vehicl…

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

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