# p5.js

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

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

**Page:** 87

---

## [Using the Mouse as a Drawing Tool](https://discourse.processing.org/t/using-the-mouse-as-a-drawing-tool/13833)

<div class="topic-metadata">

**Author:** [@van326](https://discourse.processing.org/u/van326)\
**Replies:** 2\
**Last updated:** [September 6, 2019, 2:34am UTC](https://discourse.processing.org/t/using-the-mouse-as-a-drawing-tool/13833 "2019-09-06T02:34:11Z")

</div>

Hi! I am currently playing around with coding the ability to draw in p5.js, and so far it’s turning out okay, but I have a question about using the mouse as a brush. Ideally, I would like to have it where whenever the us…

---

## [Where to put loadBytes()?](https://discourse.processing.org/t/where-to-put-loadbytes/13818)

<div class="topic-metadata">

**Author:** [@shedMusic](https://discourse.processing.org/u/shedMusic)\
**Replies:** 2\
**Last updated:** [September 5, 2019, 10:31am UTC](https://discourse.processing.org/t/where-to-put-loadbytes/13818 "2019-09-05T10:31:13Z")

</div>

Hi Can anyone confirm … can loadBytes() only be used in preload() ? If I try in setup() or anywhere else (e.g. in a new class) it doesn’t work. let data; function preload() { data = loadBytes('assets/kick.wav'); }…

---

## [Issues Logging in](https://discourse.processing.org/t/issues-logging-in/13548)

<div class="topic-metadata">

**Author:** [@van326](https://discourse.processing.org/u/van326)\
**Replies:** 9\
**Last updated:** [September 5, 2019, 3:27am UTC](https://discourse.processing.org/t/issues-logging-in/13548 "2019-09-05T03:27:53Z")

</div>

Hi! So I’m currently trying to log into my p5.js account, but whenever I hit the “Log in” button, it just gives a “Ø” as the cursor, and the page doesn’t go anywhere. It doesn’t even look like it’s trying to load, so I a…

---

## [Find EOF on CSV file](https://discourse.processing.org/t/find-eof-on-csv-file/13807)

<div class="topic-metadata">

**Author:** [@GuilhermeVolker](https://discourse.processing.org/u/GuilhermeVolker)\
**Replies:** 4\
**Last updated:** [September 5, 2019, 12:13am UTC](https://discourse.processing.org/t/find-eof-on-csv-file/13807 "2019-09-05T00:13:06Z")

</div>

Hi. I have to find the EOF (end of the file) in javaScript. I have try’d some possibilities without success. let i = myFile.realine(); if(myFile == EOF){ ... } with this code appears the following message: TypeError…

---

## [Instance mode events affecting entire html](https://discourse.processing.org/t/instance-mode-events-affecting-entire-html/13785)

<div class="topic-metadata">

**Author:** [@Brodie](https://discourse.processing.org/u/Brodie)\
**Replies:** 3\
**Last updated:** [September 4, 2019, 11:15am UTC](https://discourse.processing.org/t/instance-mode-events-affecting-entire-html/13785 "2019-09-04T11:15:50Z")

</div>

I am having an issue where the events associated with p are being applied to the entire HTML document. If I am clicking on or off the canvas, the event will be fired. Returning false also prevents default for the entire …

---

## [My P5 editor doesn't work](https://discourse.processing.org/t/my-p5-editor-doesnt-work/13769)

<div class="topic-metadata">

**Author:** [@deseingalt](https://discourse.processing.org/u/deseingalt)\
**Replies:** 5\
**Last updated:** [September 3, 2019, 10:56am UTC](https://discourse.processing.org/t/my-p5-editor-doesnt-work/13769 "2019-09-03T10:56:53Z")

</div>

sketch.js function setup() { createCanvas(400, 400); } function draw() { background(220); } Console p5 had problems creating the global function “createElement”, possibly because your code is already using that n…

---

## [Storing functions in array or arraylist returns null pointer](https://discourse.processing.org/t/storing-functions-in-array-or-arraylist-returns-null-pointer/13749)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 2\
**Last updated:** [September 1, 2019, 8:03pm UTC](https://discourse.processing.org/t/storing-functions-in-array-or-arraylist-returns-null-pointer/13749 "2019-09-01T20:03:28Z")

</div>

I’m converting code from p5 to processing. I was storing functions in an array. These functions create the buttons which I’m using in my application and allowed me to loop through the array to draw and manipulate the but…

---

## [Applying a background image to a rect()](https://discourse.processing.org/t/applying-a-background-image-to-a-rect/13711)

<div class="topic-metadata">

**Author:** [@Bubblebyb](https://discourse.processing.org/u/Bubblebyb)\
**Replies:** 2\
**Last updated:** [August 31, 2019, 11:43pm UTC](https://discourse.processing.org/t/applying-a-background-image-to-a-rect/13711 "2019-08-31T23:43:27Z")

</div>

Is it possible to have a background image for a rect() in p5? I’ve seem some answers that suggest a workaround by using a mask but all I’m looking for is having an image as a background for a shape such as a rect().

---

## [\[ SOLVED \] How to import Collide2D](https://discourse.processing.org/t/solved-how-to-import-collide2d/13713)

<div class="topic-metadata">

**Author:** [@MrShawn](https://discourse.processing.org/u/MrShawn)\
**Replies:** 4\
**Last updated:** [August 31, 2019, 5:27pm UTC](https://discourse.processing.org/t/solved-how-to-import-collide2d/13713 "2019-08-31T17:27:45Z")

</div>

Hello, I am trying to import Collide2D by @bmoren into my p5js project. I added the rawgithubcontent link to the minified library in my index.html, but it didn’t import properly. How do I properly import it? Here is my …

---

## [Save different returns for looped function](https://discourse.processing.org/t/save-different-returns-for-looped-function/13686)

<div class="topic-metadata">

**Author:** [@b\_and\_z](https://discourse.processing.org/u/b_and_z)\
**Replies:** 5\
**Last updated:** [August 31, 2019, 10:43am UTC](https://discourse.processing.org/t/save-different-returns-for-looped-function/13686 "2019-08-31T10:43:37Z")

</div>

Hi all So I have a function that creates multiple sliders. The function is then looped to create multiple sliders. I want the slider values to be stored in an array, for each slider a single array element. How would I h…

---

## [Catching a specific string position from a txt file](https://discourse.processing.org/t/catching-a-specific-string-position-from-a-txt-file/13685)

<div class="topic-metadata">

**Author:** [@GuilhermeVolker](https://discourse.processing.org/u/GuilhermeVolker)\
**Replies:** 5\
**Last updated:** [August 29, 2019, 3:04pm UTC](https://discourse.processing.org/t/catching-a-specific-string-position-from-a-txt-file/13685 "2019-08-29T15:04:36Z")

</div>

Hi I’am loading a .txt file, it has a lot of data, each line has 16 values and i need to read separetly each colum and store in a variable. Here is what i have try’d let year; let data; function preload(){ data = lo…

---

## [Natural Movement with Noise](https://discourse.processing.org/t/natural-movement-with-noise/13684)

<div class="topic-metadata">

**Author:** [@vchinner](https://discourse.processing.org/u/vchinner)\
**Replies:** 1\
**Last updated:** [August 29, 2019, 1:43pm UTC](https://discourse.processing.org/t/natural-movement-with-noise/13684 "2019-08-29T13:43:02Z")

</div>

Im creating a an object that randomly moves in a natural way using noise like this (works as intended): thisRabbit.x = \_world.width \* (noise(thisRabbit.t)); thisRabbit.y = \_world.height \* (noise(thisRabbit.t+5))…

---

## [Hide all bezier curves except the one on mouse hover](https://discourse.processing.org/t/hide-all-bezier-curves-except-the-one-on-mouse-hover/13618)

<div class="topic-metadata">

**Author:** [@VMK](https://discourse.processing.org/u/VMK)\
**Replies:** 26\
**Last updated:** [August 29, 2019, 12:08pm UTC](https://discourse.processing.org/t/hide-all-bezier-curves-except-the-one-on-mouse-hover/13618 "2019-08-29T12:08:24Z")

</div>

Greetings! I have four bezier curves (pasted code for two below as MCVE), and would like to be able to show only one if the mouse is hovered over the respective one. I tried finding how to assign a class to the curve,…

---

## [Autoformat error on objects](https://discourse.processing.org/t/autoformat-error-on-objects/13317)

<div class="topic-metadata">

**Author:** [@tobebot](https://discourse.processing.org/u/tobebot)\
**Replies:** 6\
**Last updated:** [August 29, 2019, 9:54am UTC](https://discourse.processing.org/t/autoformat-error-on-objects/13317 "2019-08-29T09:54:48Z")

</div>

Hi, my problem is using Processing IDE in Ubuntu, when I try to auto-format with ctrl+t, the objects are formatted they take a wrong format…

---

## [Resize Background Image when Resizing Window in p5.js?](https://discourse.processing.org/t/resize-background-image-when-resizing-window-in-p5-js/13671)

<div class="topic-metadata">

**Author:** [@zacharyfruhling](https://discourse.processing.org/u/zacharyfruhling)\
**Replies:** 1\
**Last updated:** [August 28, 2019, 8:36pm UTC](https://discourse.processing.org/t/resize-background-image-when-resizing-window-in-p5-js/13671 "2019-08-28T20:36:10Z")

</div>

I’m having trouble getting the background image for a p5.js sketch to resize along with the window resize function. Basically I’m preloading the image in the preload function, resizing it to match the current window widt…

---

## [P5.ble.js - Does It Work With All Browsers?](https://discourse.processing.org/t/p5-ble-js-does-it-work-with-all-browsers/13675)

<div class="topic-metadata">

**Author:** [@jgavlik](https://discourse.processing.org/u/jgavlik)\
**Replies:** 1\
**Last updated:** [August 28, 2019, 7:30pm UTC](https://discourse.processing.org/t/p5-ble-js-does-it-work-with-all-browsers/13675 "2019-08-28T19:30:07Z")

</div>

Can p5.ble.js work with more than the Chrome browser… like FireFox??

---

## [Solving an Unexpected Identifier](https://discourse.processing.org/t/solving-an-unexpected-identifier/13645)

<div class="topic-metadata">

**Author:** [@VMK](https://discourse.processing.org/u/VMK)\
**Replies:** 4\
**Last updated:** [August 28, 2019, 12:25pm UTC](https://discourse.processing.org/t/solving-an-unexpected-identifier/13645 "2019-08-28T12:25:15Z")

</div>

Greetings! I’m trying to create a class to draw a bezier curve but seeing ‘unexpected identifier’ error which doesn’t make sense to me : http://tiny.cc/xy7sbz https://editor.p5js.org/VMK/sketches/D-GpdoGiM Any help wo…

---

## [Colored circles](https://discourse.processing.org/t/colored-circles/13656)

<div class="topic-metadata">

**Author:** [@BennyElie](https://discourse.processing.org/u/BennyElie)\
**Replies:** 1\
**Last updated:** [August 28, 2019, 1:26am UTC](https://discourse.processing.org/t/colored-circles/13656 "2019-08-28T01:26:49Z")

</div>

Hi, If I have a series of circles and I would like to color them one by one, let’s say their initial state is white and I would like them to one by one change to red, how would I be able to approach this? regarding t…

---

## [\[SOLVED\] loadBytes implemented yet?](https://discourse.processing.org/t/solved-loadbytes-implemented-yet/13641)

<div class="topic-metadata">

**Author:** [@shedMusic](https://discourse.processing.org/u/shedMusic)\
**Replies:** 2\
**Last updated:** [August 27, 2019, 8:04am UTC](https://discourse.processing.org/t/solved-loadbytes-implemented-yet/13641 "2019-08-27T08:04:43Z")

</div>

Just tried using loadBytes() but the console (Edge) says it hasn’t been implemented, and the p5.js file says similar: 0: not yet implemented p5.prototype.loadBytes = function () { // TODO throw ‘not yet implemented’; …

---

## [Upload pGraphics to server](https://discourse.processing.org/t/upload-pgraphics-to-server/13558)

<div class="topic-metadata">

**Author:** [@philipplehmann](https://discourse.processing.org/u/philipplehmann)\
**Replies:** 3\
**Last updated:** [August 26, 2019, 3:07pm UTC](https://discourse.processing.org/t/upload-pgraphics-to-server/13558 "2019-08-26T15:07:10Z")

</div>

I’d like to save a pGraphics object as a PNG-image to the server. I found a way to upload the canvas object. Is it possible to export a pGraphics object in a similar way? function saveImage() { // Export canvas …

---

## [createGraphics save the whole sketch](https://discourse.processing.org/t/creategraphics-save-the-whole-sketch/13594)

<div class="topic-metadata">

**Author:** [@l3ehfar](https://discourse.processing.org/u/l3ehfar)\
**Replies:** 5\
**Last updated:** [August 26, 2019, 12:17pm UTC](https://discourse.processing.org/t/creategraphics-save-the-whole-sketch/13594 "2019-08-26T12:17:40Z")

</div>

how can I pass the whole sketch as a function to the createGraphics variable and not get the error as “img.pattern is not a function”?

---

## [Motion Detection - Chrome Browser Crashes or No Image](https://discourse.processing.org/t/motion-detection-chrome-browser-crashes-or-no-image/13400)

<div class="topic-metadata">

**Author:** [@stilts77](https://discourse.processing.org/u/stilts77)\
**Replies:** 4\
**Last updated:** [August 25, 2019, 5:02pm UTC](https://discourse.processing.org/t/motion-detection-chrome-browser-crashes-or-no-image/13400 "2019-08-25T17:02:51Z")

</div>

I found some code… I have adapted it slightly (following watching a Dan Shiffman Processing video) - but can’t get it to work. Here is the page I’ve created: Webcam motion detection In the Shiffman video online - we se…

---

## [WEBGL code in WEBEDITOR does not work](https://discourse.processing.org/t/webgl-code-in-webeditor-does-not-work/13475)

<div class="topic-metadata">

**Author:** [@rubbing](https://discourse.processing.org/u/rubbing)\
**Replies:** 3\
**Last updated:** [August 25, 2019, 3:30am UTC](https://discourse.processing.org/t/webgl-code-in-webeditor-does-not-work/13475 "2019-08-25T03:30:39Z")

</div>

When I use the p5.js web editor all my WEBGL codes do not work. It was working a few hours ago. What is everyone else’s experience? EDIT: I tested my code on my mothers laptop and it works on mozilla firefox, for some r…

---

## [Problem with conditional structure with « if » into loop](https://discourse.processing.org/t/problem-with-conditional-structure-with-if-into-loop/13551)

<div class="topic-metadata">

**Author:** [@jerome51](https://discourse.processing.org/u/jerome51)\
**Replies:** 2\
**Last updated:** [August 23, 2019, 8:29am UTC](https://discourse.processing.org/t/problem-with-conditional-structure-with-if-into-loop/13551 "2019-08-23T08:29:11Z")

</div>

Hi, Sorry for my english, i’m french. I’d like to check each pixel from image by step of 5 and write coordinates into an array of each pixel whose value is under 150. I used a loops to check pixels and a « if » to ver…

---

## [How to clean this JSON?](https://discourse.processing.org/t/how-to-clean-this-json/13511)

<div class="topic-metadata">

**Author:** [@vjjv](https://discourse.processing.org/u/vjjv)\
**Replies:** 6\
**Last updated:** [August 21, 2019, 5:56pm UTC](https://discourse.processing.org/t/how-to-clean-this-json/13511 "2019-08-21T17:56:37Z")

</div>

Hellooo! im using google Apis to request data from a blog. I want to be able to acces the content of a post, but in the json file the body of the text is between html code. how can i remove it ? in orden to get only the…

---

## [Dragging canvas out of the browser (as an image)](https://discourse.processing.org/t/dragging-canvas-out-of-the-browser-as-an-image/13183)

<div class="topic-metadata">

**Author:** [@thirstydude](https://discourse.processing.org/u/thirstydude)\
**Replies:** 7\
**Last updated:** [August 21, 2019, 6:27pm UTC](https://discourse.processing.org/t/dragging-canvas-out-of-the-browser-as-an-image/13183 "2019-08-21T18:27:22Z")

</div>

Hi everyone! this is my first post and i hope i am in the right section here. Also, i am very new to p5 and coding in general so please bear with me :slight\_smile: i am kind of stuck in a very simple project i’m doing.…

---

## [How to have a p5 sketch continue to run while not in the selected tab?](https://discourse.processing.org/t/how-to-have-a-p5-sketch-continue-to-run-while-not-in-the-selected-tab/13476)

<div class="topic-metadata">

**Author:** [@Quillbert1](https://discourse.processing.org/u/Quillbert1)\
**Replies:** 2\
**Last updated:** [August 19, 2019, 5:47pm UTC](https://discourse.processing.org/t/how-to-have-a-p5-sketch-continue-to-run-while-not-in-the-selected-tab/13476 "2019-08-19T17:47:30Z")

</div>

I am making a p5 sketch, and I want it to be able to run while it is in the background, but whenever its tab is not selected, it pauses. How do I fix this?

---

## [Making p5.js downloadable again (solved)](https://discourse.processing.org/t/making-p5-js-downloadable-again-solved/13457)

<div class="topic-metadata">

**Author:** [@EnderArchery](https://discourse.processing.org/u/EnderArchery)\
**Replies:** 5\
**Last updated:** [August 19, 2019, 3:27pm UTC](https://discourse.processing.org/t/making-p5-js-downloadable-again-solved/13457 "2019-08-19T15:27:41Z")

</div>

Well, as you might have noticed, every download link on the p5js.org page takes you to their support page. And that’s it unfortunately. You apparently can’t download it.

---

## [Pie Chart with only 5 datasets/arrays (Noob)](https://discourse.processing.org/t/pie-chart-with-only-5-datasets-arrays-noob/13464)

<div class="topic-metadata">

**Author:** [@harlo1](https://discourse.processing.org/u/harlo1)\
**Replies:** 2\
**Last updated:** [August 19, 2019, 5:24am UTC](https://discourse.processing.org/t/pie-chart-with-only-5-datasets-arrays-noob/13464 "2019-08-19T05:24:17Z")

</div>

I’m just getting started (noob) - I’m confused about using the pie chart to represent data - I converted data into 360 degrees but it still doesn’t seem to be working. Any advice? Here’s the code for reference: let ang…

---

## [Weird arc full circle (bug?)](https://discourse.processing.org/t/weird-arc-full-circle-bug/13439)

<div class="topic-metadata">

**Author:** [@atuco](https://discourse.processing.org/u/atuco)\
**Replies:** 1\
**Last updated:** [August 17, 2019, 10:53pm UTC](https://discourse.processing.org/t/weird-arc-full-circle-bug/13439 "2019-08-17T22:53:58Z")

</div>

Hi, I try to export a processing sketch in js but I’ve a strange behaviour. There are stranges randoms (and always in the begining of the sketch) full circles only in the js You can see in this page: https://codepen.io…

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

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