# p5.js

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

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

**Page:** 86

---

## [Inpainting, image processing, complex functions](https://discourse.processing.org/t/inpainting-image-processing-complex-functions/14223)

<div class="topic-metadata">

**Author:** [@nsegal](https://discourse.processing.org/u/nsegal)\
**Replies:** 3\
**Last updated:** [September 30, 2019, 11:20pm UTC](https://discourse.processing.org/t/inpainting-image-processing-complex-functions/14223 "2019-09-30T23:20:19Z")

</div>

I’m trying to code a program that will visualize the effect of various polynomial functions on the complex plane. For example, the first image below shows a segment of the complex plane, centered on (0, 0), colored accor…

---

## [Saving p5js canvas as image to a server/database](https://discourse.processing.org/t/saving-p5js-canvas-as-image-to-a-server-database/14199)

<div class="topic-metadata">

**Author:** [@AndreasRef](https://discourse.processing.org/u/AndreasRef)\
**Replies:** 3\
**Last updated:** [September 30, 2019, 1:56pm UTC](https://discourse.processing.org/t/saving-p5js-canvas-as-image-to-a-server-database/14199 "2019-09-30T13:56:46Z")

</div>

Hi Short question What is the simplest way to save the p5js canvas on a public website (that everybody can access) as an image file to a server (that only I can see)? Longer explantion: I have made an art project wit…

---

## [P5.js interfering with my normal js?](https://discourse.processing.org/t/p5-js-interfering-with-my-normal-js/14299)

<div class="topic-metadata">

**Author:** [@grant](https://discourse.processing.org/u/grant)\
**Replies:** 0\
**Last updated:** [September 30, 2019, 3:17am UTC](https://discourse.processing.org/t/p5-js-interfering-with-my-normal-js/14299 "2019-09-30T03:17:03Z")

</div>

Hello, I’m trying to figure out why my typewriter effect wont work with my existing p5.js sketch? gif to give some explanation (https://gyazo.com/0421c071bdb4a2b5ecd0dfdf3ec3e66d) Basically, I created a whole new html…

---

## [10 boxes with random colors in specific locations](https://discourse.processing.org/t/10-boxes-with-random-colors-in-specific-locations/14227)

<div class="topic-metadata">

**Author:** [@van326](https://discourse.processing.org/u/van326)\
**Replies:** 4\
**Last updated:** [September 30, 2019, 3:41am UTC](https://discourse.processing.org/t/10-boxes-with-random-colors-in-specific-locations/14227 "2019-09-30T03:41:00Z")

</div>

I have finally started to understand classes and arrays (somewhat)! In the link I provided, I was trying to make at least 10 boxes with random colors in specific locations. So far, I think they are all showing, but I am …

---

## [Understanding rotate before translate](https://discourse.processing.org/t/understanding-rotate-before-translate/8631)

<div class="topic-metadata">

**Author:** [@dougouverson](https://discourse.processing.org/u/dougouverson)\
**Replies:** 14\
**Last updated:** [February 24, 2019, 9:58pm UTC](https://discourse.processing.org/t/understanding-rotate-before-translate/8631 "2019-02-24T21:58:32Z")

</div>

I’m on page 168 of “Getting Started with P5.js” and having a difficulty wrapping my head around the rotate() before translate() vs translate() before rotate(): When rotate() is before translate(), why does "The shape no…

---

## [P5js: 3D Typography Problems/Bugs?](https://discourse.processing.org/t/p5js-3d-typography-problems-bugs/14271)

<div class="topic-metadata">

**Author:** [@raetrakt](https://discourse.processing.org/u/raetrakt)\
**Replies:** 0\
**Last updated:** [September 29, 2019, 11:24am UTC](https://discourse.processing.org/t/p5js-3d-typography-problems-bugs/14271 "2019-09-29T11:24:24Z")

</div>

Adding Typography to my Sphere sketch caused further problems: -Some of the glyphs appear to have a white background, whereas others appear to have a transparent background. (Potentially an issue caused by the font bein…

---

## [Merging Canvas With HTML Website](https://discourse.processing.org/t/merging-canvas-with-html-website/14250)

<div class="topic-metadata">

**Author:** [@grant](https://discourse.processing.org/u/grant)\
**Replies:** 3\
**Last updated:** [September 28, 2019, 10:56pm UTC](https://discourse.processing.org/t/merging-canvas-with-html-website/14250 "2019-09-28T22:56:38Z")

</div>

Hello, I’m relatively new to HTML, CSS, and recently JS. I was inspired from https://ertdfgcvb.xyz/ to create something like that website with the js animations and mouse tracking interactions/trail for my first project. …

---

## [How to play sound on muted iPhone?](https://discourse.processing.org/t/how-to-play-sound-on-muted-iphone/12870)

<div class="topic-metadata">

**Author:** [@epignosis567](https://discourse.processing.org/u/epignosis567)\
**Replies:** 2\
**Last updated:** [September 28, 2019, 8:35pm UTC](https://discourse.processing.org/t/how-to-play-sound-on-muted-iphone/12870 "2019-09-28T20:35:48Z")

</div>

Hi. I alluded to this elsewhere in a post but I can’t figure out why P5 won’t play sound on a muted iPhone. I’m new to coding but it seems like a lot of other javascript will play sounds on muted iPhones. Here’s a post f…

---

## [Audio Example not working](https://discourse.processing.org/t/audio-example-not-working/14188)

<div class="topic-metadata">

**Author:** [@philspitler](https://discourse.processing.org/u/philspitler)\
**Replies:** 15\
**Last updated:** [September 28, 2019, 4:46pm UTC](https://discourse.processing.org/t/audio-example-not-working/14188 "2019-09-28T16:46:09Z")

</div>

Hi, I’m a total noob to p5 although I have done a fair amount of Processing work over the years. I am trying to get the “hello amplitude” sketch to work but keep getting errors… I took the files from here. https://the…

---

## [Particles not deleting at the same time](https://discourse.processing.org/t/particles-not-deleting-at-the-same-time/14190)

<div class="topic-metadata">

**Author:** [@flengwin](https://discourse.processing.org/u/flengwin)\
**Replies:** 3\
**Last updated:** [September 28, 2019, 5:06am UTC](https://discourse.processing.org/t/particles-not-deleting-at-the-same-time/14190 "2019-09-28T05:06:30Z")

</div>

Hello, I am working on a fireworks project. It seems when I increase the amount of particles to spawn in setup they delete at different times. I have them all updating at the same time so I don’t understand why they are …

---

## [How to navigate to certain HTML-section?](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111)

<div class="topic-metadata">

**Author:** [@hut](https://discourse.processing.org/u/hut)\
**Replies:** 4\
**Last updated:** [September 26, 2019, 1:20pm UTC](https://discourse.processing.org/t/how-to-navigate-to-certain-html-section/14111 "2019-09-26T13:20:27Z")

</div>

Hi! I believe my problem is fairly simple, but I just couldn’t find any answers: My p5-sketch is embedded inside a single-page website. When I click on a certain element inside the sketch, I want to scroll down to a ce…

---

## [mousePressed() with several objects](https://discourse.processing.org/t/mousepressed-with-several-objects/14157)

<div class="topic-metadata">

**Author:** [@Paulo](https://discourse.processing.org/u/Paulo)\
**Replies:** 2\
**Last updated:** [September 25, 2019, 1:24pm UTC](https://discourse.processing.org/t/mousepressed-with-several-objects/14157 "2019-09-25T13:24:38Z")

</div>

Hi, The code below shows how to used mousePressed() with a form, but I have no idea how to use it with several forms. I am building an Org Chart with hundreds of nodes and I would like to use mousePressed() to collapse…

---

## [\[SOLVED\] Shape stroke disappearing with resize -- solved, Clipping Plane issue](https://discourse.processing.org/t/solved-shape-stroke-disappearing-with-resize-solved-clipping-plane-issue/2514)

<div class="topic-metadata">

**Author:** [@stefan](https://discourse.processing.org/u/stefan)\
**Replies:** 1\
**Last updated:** [September 24, 2019, 5:24pm UTC](https://discourse.processing.org/t/solved-shape-stroke-disappearing-with-resize-solved-clipping-plane-issue/2514 "2019-09-24T17:24:51Z")

</div>

When the window narrows and var ‘dist’ gets smaller, this happens: Edit: if your shapes look like this, the culprit is the clipping plane. The Coding Train video on P5 js Camera features a solution.

---

## [How to stop pull-to-refresh in p5.js Web Editor](https://discourse.processing.org/t/how-to-stop-pull-to-refresh-in-p5-js-web-editor/14058)

<div class="topic-metadata">

**Author:** [@rise](https://discourse.processing.org/u/rise)\
**Replies:** 7\
**Last updated:** [September 22, 2019, 8:54pm UTC](https://discourse.processing.org/t/how-to-stop-pull-to-refresh-in-p5-js-web-editor/14058 "2019-09-22T20:54:33Z")

</div>

Hi, I’ve created a webpage that involves some dragging and dropping features and I would like to disable the “pull-to-refresh” feature of the browser. I read that by adding the line “overscroll-behavior-y: contain;” to…

---

## [Save Image as SVG](https://discourse.processing.org/t/save-image-as-svg/14108)

<div class="topic-metadata">

**Author:** [@mikolaskoa](https://discourse.processing.org/u/mikolaskoa)\
**Replies:** 0\
**Last updated:** [September 22, 2019, 2:22pm UTC](https://discourse.processing.org/t/save-image-as-svg/14108 "2019-09-22T14:22:13Z")

</div>

Hello, I would like to save the canvas as SVG. I found this: https://editor.p5js.org/dannyrozin/sketches/r1djoVow7 But it does not work for Canvas content created as Image f.e. http://www.mikolaskova.cz/testscreen/10/ …

---

## [Blurred Image instead of pixels visible](https://discourse.processing.org/t/blurred-image-instead-of-pixels-visible/14071)

<div class="topic-metadata">

**Author:** [@mikolaskoa](https://discourse.processing.org/u/mikolaskoa)\
**Replies:** 4\
**Last updated:** [September 21, 2019, 4:59pm UTC](https://discourse.processing.org/t/blurred-image-instead-of-pixels-visible/14071 "2019-09-21T16:59:32Z")

</div>

Hello, how can I make the pixels of an image stay sharp on screen? When I create them directly with the set-Method, they stay sharp. When creating an image - they get blurred (which is usefull if there are gradients,…

---

## [Easy 'for loop' question](https://discourse.processing.org/t/easy-for-loop-question/14075)

<div class="topic-metadata">

**Author:** [@SheCurvesMobius](https://discourse.processing.org/u/SheCurvesMobius)\
**Replies:** 3\
**Last updated:** [September 19, 2019, 8:44pm UTC](https://discourse.processing.org/t/easy-for-loop-question/14075 "2019-09-19T20:44:27Z")

</div>

What am I missing here? I’m expecting that the background should cycle through from black to white. …it’s not. function setup() { createCanvas(100, 100); } function draw() { for (let x = 0; x \< 256; x++) { backgrou…

---

## [Help with sine waves](https://discourse.processing.org/t/help-with-sine-waves/14040)

<div class="topic-metadata">

**Author:** [@erinhasplants](https://discourse.processing.org/u/erinhasplants)\
**Replies:** 3\
**Last updated:** [September 18, 2019, 5:46pm UTC](https://discourse.processing.org/t/help-with-sine-waves/14040 "2019-09-18T17:46:31Z")

</div>

https://editor.p5js.org/johnbeesley/sketches/UBFN-z8ob i have this sketch ^ and its going all well, but i cant figure out how I can make the circles go different ways, and make a sine wave. i have the sine wave out of …

---

## [Speech recognition library issues (P5.speech)](https://discourse.processing.org/t/speech-recognition-library-issues-p5-speech/14014)

<div class="topic-metadata">

**Author:** [@feelthemall](https://discourse.processing.org/u/feelthemall)\
**Replies:** 1\
**Last updated:** [September 17, 2019, 2:10am UTC](https://discourse.processing.org/t/speech-recognition-library-issues-p5-speech/14014 "2019-09-17T02:10:58Z")

</div>

The stop() method is not working in my scetch. The console throws out this message: sketch.js:28 Uncaught TypeError: myRec.stop is not a function and it doesn’t matter where I’m using it inside the scetch, the result i…

---

## [createGraphics on mobile device](https://discourse.processing.org/t/creategraphics-on-mobile-device/13987)

<div class="topic-metadata">

**Author:** [@b\_and\_z](https://discourse.processing.org/u/b_and_z)\
**Replies:** 2\
**Last updated:** [September 18, 2019, 3:43pm UTC](https://discourse.processing.org/t/creategraphics-on-mobile-device/13987 "2019-09-18T15:43:23Z")

</div>

so working with createGraphics and hi DPI screens is a known issue which apparently has been fixed. However, I still have some struggles with working with Graphics on mobile devices. I have this code where stuff is draw…

---

## [Sound crackles when using the amp method](https://discourse.processing.org/t/sound-crackles-when-using-the-amp-method/14032)

<div class="topic-metadata">

**Author:** [@thiblejack](https://discourse.processing.org/u/thiblejack)\
**Replies:** 0\
**Last updated:** [September 17, 2019, 8:25pm UTC](https://discourse.processing.org/t/sound-crackles-when-using-the-amp-method/14032 "2019-09-17T20:25:21Z")

</div>

Hi, I’m trying to implement a polyphonic synthesizer with polyphonic aftertouch. But when I route the aftertouch events to the amplitude of my sine, it crackles a lot. I guess it’s happening because this method is not i…

---

## [Loading images from a local Web Editor](https://discourse.processing.org/t/loading-images-from-a-local-web-editor/13972)

<div class="topic-metadata">

**Author:** [@leonardof131](https://discourse.processing.org/u/leonardof131)\
**Replies:** 6\
**Last updated:** [September 16, 2019, 1:57pm UTC](https://discourse.processing.org/t/loading-images-from-a-local-web-editor/13972 "2019-09-16T13:57:52Z")

</div>

So, I managed to run a version of the Web Editor for our ONG. You can check my post history to see what I’m talking about. The thing is, how can we have a folder with some images on it, so our students can use them ? F…

---

## [Need help for p5.js ellipse "detail"](https://discourse.processing.org/t/need-help-for-p5-js-ellipse-detail/13983)

<div class="topic-metadata">

**Author:** [@SayokoWang](https://discourse.processing.org/u/SayokoWang)\
**Replies:** 2\
**Last updated:** [September 14, 2019, 6:35am UTC](https://discourse.processing.org/t/need-help-for-p5-js-ellipse-detail/13983 "2019-09-14T06:35:13Z")

</div>

Hi, I am new to p5.js; now I can draw ellipse ; but I don’t understand the “detail” in ellipse(x, y, w, h, detail) , how to use “detail”, I found no one example for it.

---

## [Pass image path into loadimage](https://discourse.processing.org/t/pass-image-path-into-loadimage/13966)

<div class="topic-metadata">

**Author:** [@KicksTV](https://discourse.processing.org/u/KicksTV)\
**Replies:** 5\
**Last updated:** [September 13, 2019, 12:05pm UTC](https://discourse.processing.org/t/pass-image-path-into-loadimage/13966 "2019-09-13T12:05:33Z")

</div>

I am having the problem where I want to pass a variable with image path into loadImage(). However, I am getting the error: This must be possible but I don’t see anything in docs or online demonstrating this.

---

## [P5.js library and sound issue (bug?)](https://discourse.processing.org/t/p5-js-library-and-sound-issue-bug/13923)

<div class="topic-metadata">

**Author:** [@gaborpszti](https://discourse.processing.org/u/gaborpszti)\
**Replies:** 0\
**Last updated:** [September 11, 2019, 9:58am UTC](https://discourse.processing.org/t/p5-js-library-and-sound-issue-bug/13923 "2019-09-11T09:58:48Z")

</div>

I copied a code from p5.js website ( https://p5js.org/examples/sound-oscillator-frequency.html ) on oscillator example. It runs perfectly on official online p5.js editor, however when I paste it in my Brackets editor it…

---

## [Making shapes and deleting them?](https://discourse.processing.org/t/making-shapes-and-deleting-them/13888)

<div class="topic-metadata">

**Author:** [@freek\_b](https://discourse.processing.org/u/freek_b)\
**Replies:** 8\
**Last updated:** [September 9, 2019, 3:58pm UTC](https://discourse.processing.org/t/making-shapes-and-deleting-them/13888 "2019-09-09T15:58:04Z")

</div>

i have tried to find a way to add shapes (circles and so) while its running just the problem is i am not able to find the right command i have found a few people saying that i should use something alike new circle(20,2…

---

## [Helping a teacher with the Web Editor](https://discourse.processing.org/t/helping-a-teacher-with-the-web-editor/13822)

<div class="topic-metadata">

**Author:** [@leonardof131](https://discourse.processing.org/u/leonardof131)\
**Replies:** 2\
**Last updated:** [September 9, 2019, 12:29pm UTC](https://discourse.processing.org/t/helping-a-teacher-with-the-web-editor/13822 "2019-09-09T12:29:48Z")

</div>

Greetings from Brazil! My name is Leo and I’m a teacher for an ONG that focuses in delivering STEAM education to poor children in my local region. We’re planning to do some coding classes with them, and the easy of use…

---

## [How do I get my sketch to show the steps of a drawing](https://discourse.processing.org/t/how-do-i-get-my-sketch-to-show-the-steps-of-a-drawing/13808)

<div class="topic-metadata">

**Author:** [@rbytes](https://discourse.processing.org/u/rbytes)\
**Replies:** 2\
**Last updated:** [September 5, 2019, 1:04am UTC](https://discourse.processing.org/t/how-do-i-get-my-sketch-to-show-the-steps-of-a-drawing/13808 "2019-09-05T01:04:31Z")

</div>

When I run my sketch “Spiral of Theodore’s” on OpenProcessing, the entire drawing appears almost instantly. I would prefer that it appear triangle by triangle, so that other viewers could see the progress. I have been …

---

## [Font from Adobe Font Library](https://discourse.processing.org/t/font-from-adobe-font-library/13856)

<div class="topic-metadata">

**Author:** [@VMK](https://discourse.processing.org/u/VMK)\
**Replies:** 2\
**Last updated:** [September 7, 2019, 2:05am UTC](https://discourse.processing.org/t/font-from-adobe-font-library/13856 "2019-09-07T02:05:53Z")

</div>

Greetings! I’d like to use fonts from the Adobe Font Library into my sketch using P5js. Adobe give a link to a CSS file that I’m able to add to the html file and then in the CSS file I add an @import url(same link) I’…

---

## [Directory of Images Associated With Project](https://discourse.processing.org/t/directory-of-images-associated-with-project/13529)

<div class="topic-metadata">

**Author:** [@hbtousa](https://discourse.processing.org/u/hbtousa)\
**Replies:** 5\
**Last updated:** [September 7, 2019, 2:07am UTC](https://discourse.processing.org/t/directory-of-images-associated-with-project/13529 "2019-09-07T02:07:41Z")

</div>

I need to load,one at the time, lots of images that are sitting at my desktop. A single picture can be displayed by using : function setup() { createCanvas(576, 720); img = createImg(‘image3.jpg’); img.hide(); } I…

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

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