# p5.js

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

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

**Page:** 106

---

## [Why is the pixels array "unidimensional" and not bidimensional?](https://discourse.processing.org/t/why-is-the-pixels-array-unidimensional-and-not-bidimensional/5445)

<div class="topic-metadata">

**Author:** [@Dino6](https://discourse.processing.org/u/Dino6)\
**Replies:** 7\
**Last updated:** [November 11, 2018, 7:03pm UTC](https://discourse.processing.org/t/why-is-the-pixels-array-unidimensional-and-not-bidimensional/5445 "2018-11-11T19:03:24Z")

</div>

I’m just curious, I’m trying to build my own kind of pixels array out of processing/p5 and I’m wondering if it should be a normal array or a bidimensional array. I can easily pull the xy coords from the unidimensional a…

---

## [Why is the function Fill not found? but the rest of the functions on the library yes?](https://discourse.processing.org/t/why-is-the-function-fill-not-found-but-the-rest-of-the-functions-on-the-library-yes/5447)

<div class="topic-metadata">

**Author:** [@gio](https://discourse.processing.org/u/gio)\
**Replies:** 1\
**Last updated:** [November 11, 2018, 2:57pm UTC](https://discourse.processing.org/t/why-is-the-function-fill-not-found-but-the-rest-of-the-functions-on-the-library-yes/5447 "2018-11-11T14:57:50Z")

</div>

Im workingon a P5.js sketch… Instead of creating objects with a constructor function, and then using the new keyword. I want to use a factory function. It seems to work fine, and renders correclty when using for examp…

---

## [Trouble rotating an array of objects](https://discourse.processing.org/t/trouble-rotating-an-array-of-objects/5423)

<div class="topic-metadata">

**Author:** [@Speedofox](https://discourse.processing.org/u/Speedofox)\
**Replies:** 2\
**Last updated:** [November 11, 2018, 9:57am UTC](https://discourse.processing.org/t/trouble-rotating-an-array-of-objects/5423 "2018-11-11T09:57:01Z")

</div>

I have created an array of objects using a class call Triangle. How can I translate each of these objects so that they all spin independently on their own axis? So far I have gotten them all to rotate correctly but the a…

---

## [Working with SVG files](https://discourse.processing.org/t/working-with-svg-files/5377)

<div class="topic-metadata">

**Author:** [@juju11](https://discourse.processing.org/u/juju11)\
**Replies:** 12\
**Last updated:** [November 11, 2018, 12:40am UTC](https://discourse.processing.org/t/working-with-svg-files/5377 "2018-11-11T00:40:17Z")

</div>

hi! I’m trying to use an SVG file to display a vector cat picture, but the image won’t appear? even when using a local host from node js ( which is tiresome to manually refresh it when I change the code). What do you gu…

---

## [Applying specific colors to a p5.Geometry](https://discourse.processing.org/t/applying-specific-colors-to-a-p5-geometry/5228)

<div class="topic-metadata">

**Author:** [@philippe](https://discourse.processing.org/u/philippe)\
**Replies:** 0\
**Last updated:** [November 5, 2018, 2:51pm UTC](https://discourse.processing.org/t/applying-specific-colors-to-a-p5-geometry/5228 "2018-11-05T14:51:51Z")

</div>

I have made a sphere using new p5.Geometry() geometry = new p5.Geometry(definition, definition, ellipsoid); geometry.computeFaces().\_makeTriangleEdges().\_edgesToVertices(); renderer.createBuffers(gId, geometry); rendere…

---

## [Record audio from sketch P5](https://discourse.processing.org/t/record-audio-from-sketch-p5/5382)

<div class="topic-metadata">

**Author:** [@magapascansky](https://discourse.processing.org/u/magapascansky)\
**Replies:** 1\
**Last updated:** [November 9, 2018, 3:59pm UTC](https://discourse.processing.org/t/record-audio-from-sketch-p5/5382 "2018-11-09T15:59:55Z")

</div>

Hello! I am developing a sketch with p5.js that simulates playing drums and my idea is to play drum sounds when you press keys (already done) and to be able to record it. The only recording examples/tutoriales that I’v…

---

## [Dynamically update alpha in color()](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339)

<div class="topic-metadata">

**Author:** [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Replies:** 5\
**Last updated:** [November 9, 2018, 2:16am UTC](https://discourse.processing.org/t/dynamically-update-alpha-in-color/5339 "2018-11-09T02:16:35Z")

</div>

So, what if I wanted to dynamically change each individual rgba argument of color(), can I say this.col.r = 200; , or some equivalent? let btn; function setup() { createCanvas(400, 400); btn = new Btn(color(50, 127, …

---

## [Load sketch.js dynamically](https://discourse.processing.org/t/load-sketch-js-dynamically/5354)

<div class="topic-metadata">

**Author:** [@edufissure](https://discourse.processing.org/u/edufissure)\
**Replies:** 0\
**Last updated:** [November 8, 2018, 8:00pm UTC](https://discourse.processing.org/t/load-sketch-js-dynamically/5354 "2018-11-08T20:00:09Z")

</div>

Hello im a newbie here in p5.js and i need some help: Im trying to launch sketch.js when i click on start game… but i cant get it… This is my code: \<!DOCTYPE html\> \<html lang="en"\> \<head\> \<meta charset="UTF-8"\> …

---

## [The request status was: 0 ()](https://discourse.processing.org/t/the-request-status-was-0/5295)

<div class="topic-metadata">

**Author:** [@bitome](https://discourse.processing.org/u/bitome)\
**Replies:** 2\
**Last updated:** [November 8, 2018, 6:00am UTC](https://discourse.processing.org/t/the-request-status-was-0/5295 "2018-11-08T06:00:26Z")

</div>

hi, using a sound example file from the p5 website I get this error when i try to run it on my computer, it worked yesterday but its stuck on loading now, even though i’m using the same code and running it through bracke…

---

## [Gentle jiggle with sine wave](https://discourse.processing.org/t/gentle-jiggle-with-sine-wave/5291)

<div class="topic-metadata">

**Author:** [@yangs](https://discourse.processing.org/u/yangs)\
**Replies:** 5\
**Last updated:** [November 7, 2018, 11:15pm UTC](https://discourse.processing.org/t/gentle-jiggle-with-sine-wave/5291 "2018-11-07T23:15:42Z")

</div>

Hi all! I’m hoping someone could point me in the right direction. I’m attempting to create a function that allows the user to draw lines, but the lines will gently wiggle, like if they are being blown in the wind. For th…

---

## [Drawing that follows the movement of a QR code in front of the webcam](https://discourse.processing.org/t/drawing-that-follows-the-movement-of-a-qr-code-in-front-of-the-webcam/5281)

<div class="topic-metadata">

**Author:** [@MG001](https://discourse.processing.org/u/MG001)\
**Replies:** 1\
**Last updated:** [November 7, 2018, 5:17pm UTC](https://discourse.processing.org/t/drawing-that-follows-the-movement-of-a-qr-code-in-front-of-the-webcam/5281 "2018-11-07T17:17:12Z")

</div>

Hello, I want to create a p5.js sketch that makes it possible to draw via the movement of a QR code (or with something like that) in front of the webcam. For example I saw this: https://kylemcdonald.github.io/cv-examp…

---

## [Pass an array to a new instance of my class](https://discourse.processing.org/t/pass-an-array-to-a-new-instance-of-my-class/5183)

<div class="topic-metadata">

**Author:** [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Replies:** 20\
**Last updated:** [November 6, 2018, 10:21pm UTC](https://discourse.processing.org/t/pass-an-array-to-a-new-instance-of-my-class/5183 "2018-11-06T22:21:19Z")

</div>

How would I go about passing an array of images to a class? My endgame is to have one class that creates an animation, so when I create multiple instances of this class they build a 3x3 grid of animations with each insta…

---

## [Raining effect in transparent background](https://discourse.processing.org/t/raining-effect-in-transparent-background/4565)

<div class="topic-metadata">

**Author:** [@juju11](https://discourse.processing.org/u/juju11)\
**Replies:** 7\
**Last updated:** [November 5, 2018, 2:57pm UTC](https://discourse.processing.org/t/raining-effect-in-transparent-background/4565 "2018-11-05T14:57:45Z")

</div>

Hi, I’m really new to p5js :tired\_face: and right now I’m making a rain effect in p5. It went well with a background color in my canvas. ( https://cl.ly/d49185682356 ) However, What I want to do is making the background…

---

## [Citing p5.js (academic)?](https://discourse.processing.org/t/citing-p5-js-academic/4877)

<div class="topic-metadata">

**Author:** [@j6m8](https://discourse.processing.org/u/j6m8)\
**Replies:** 4\
**Last updated:** [November 5, 2018, 2:57pm UTC](https://discourse.processing.org/t/citing-p5-js-academic/4877 "2018-11-05T14:57:30Z")

</div>

I would like to cite p5.js in an upcoming publication and am not sure where to point; currently we’re just pointing to the homepage (https://p5js.org/) but if there’s a specific document you like us to reference, I’d pre…

---

## [Changing innerHtml trough p5](https://discourse.processing.org/t/changing-innerhtml-trough-p5/5192)

<div class="topic-metadata">

**Author:** [@Noxid](https://discourse.processing.org/u/Noxid)\
**Replies:** 5\
**Last updated:** [November 4, 2018, 7:40pm UTC](https://discourse.processing.org/t/changing-innerhtml-trough-p5/5192 "2018-11-04T19:40:36Z")

</div>

Is p5 capable of changing the innerHTML of an html element?I know that you can change the value trough select(#something).value(); but is there an equivalent to this function for changing innerHTML

---

## [Using the Array of Objects Resource with unique objects](https://discourse.processing.org/t/using-the-array-of-objects-resource-with-unique-objects/5182)

<div class="topic-metadata">

**Author:** [@yangs](https://discourse.processing.org/u/yangs)\
**Replies:** 8\
**Last updated:** [November 4, 2018, 7:39pm UTC](https://discourse.processing.org/t/using-the-array-of-objects-resource-with-unique-objects/5182 "2018-11-04T19:39:37Z")

</div>

Hi all! I’m stuck on something and I’m sure the answer is a simple one but I can’t seem to find the issue. Using the p5js Array of Objects, I’m essentially trying to exactly that, with squiggly objects instead of ellips…

---

## [P5js Agent Based Modeling](https://discourse.processing.org/t/p5js-agent-based-modeling/5188)

<div class="topic-metadata">

**Author:** [@backspaces](https://discourse.processing.org/u/backspaces)\
**Replies:** 0\
**Last updated:** [November 4, 2018, 6:45pm UTC](https://discourse.processing.org/t/p5js-agent-based-modeling/5188 "2018-11-04T18:45:39Z")

</div>

I’m currently working on AgentScript, a Javascript subset of NetLogo. Are any of us P5js’ers working in that area? My interest in P5js is using it as a View/App for AgentScript’s core Model module. (We distinguish bet…

---

## [Transitioning to p5.js from Processing. Maybe. Begrudgingly](https://discourse.processing.org/t/transitioning-to-p5-js-from-processing-maybe-begrudgingly/5125)

<div class="topic-metadata">

**Author:** [@dgennetten](https://discourse.processing.org/u/dgennetten)\
**Replies:** 1\
**Last updated:** [November 2, 2018, 5:56pm UTC](https://discourse.processing.org/t/transitioning-to-p5-js-from-processing-maybe-begrudgingly/5125 "2018-11-02T17:56:00Z")

</div>

It is my understanding that p5.js still puts a bunch of stuff in the global scope which isn’t a common pattern for JS libraries anymore, and isn’t very comforting to someone coming from Java. This also trips up my desire…

---

## [Changing stroke colour using recursion](https://discourse.processing.org/t/changing-stroke-colour-using-recursion/4951)

<div class="topic-metadata">

**Author:** [@greg500](https://discourse.processing.org/u/greg500)\
**Replies:** 9\
**Last updated:** [November 1, 2018, 10:51pm UTC](https://discourse.processing.org/t/changing-stroke-colour-using-recursion/4951 "2018-11-01T22:51:38Z")

</div>

I am struggling with the error of which throw me once I am trying to recursively change a colour. The error is: “Uncaught TypeError Cannot read property ‘map’ of undefined (sketch: line 18)” and reference to this piece o…

---

## [Automatically scraping images/text/content from a website and posting them to Tumblr?](https://discourse.processing.org/t/automatically-scraping-images-text-content-from-a-website-and-posting-them-to-tumblr/5036)

<div class="topic-metadata">

**Author:** [@snacks](https://discourse.processing.org/u/snacks)\
**Replies:** 2\
**Last updated:** [November 1, 2018, 5:44pm UTC](https://discourse.processing.org/t/automatically-scraping-images-text-content-from-a-website-and-posting-them-to-tumblr/5036 "2018-11-01T17:44:59Z")

</div>

Hi all, I’m new to Javascript and to programming code in general. I’m wondering if there’s a way to automatically collect random images and text from a url, and then automatically posting them to a site like Tumblr or Wo…

---

## [Does changing colorMode affect performance?](https://discourse.processing.org/t/does-changing-colormode-affect-performance/5032)

<div class="topic-metadata">

**Author:** [@inersha](https://discourse.processing.org/u/inersha)\
**Replies:** 9\
**Last updated:** [November 1, 2018, 9:47am UTC](https://discourse.processing.org/t/does-changing-colormode-affect-performance/5032 "2018-11-01T09:47:13Z")

</div>

Hello there! Does changing colorMode() from RGB to HSB affect performance in any way? In other words, does it require more processing power to convert everything back to RGB if you switch to using HSB? I’ve switched to…

---

## [Issue with loading images](https://discourse.processing.org/t/issue-with-loading-images/5061)

<div class="topic-metadata">

**Author:** [@Quillbert1](https://discourse.processing.org/u/Quillbert1)\
**Replies:** 9\
**Last updated:** [November 1, 2018, 3:05am UTC](https://discourse.processing.org/t/issue-with-loading-images/5061 "2018-11-01T03:05:12Z")

</div>

When I run this program with the editor, it works fine. But when I download the files and try to use Chrome to run the program, it just says “Loading…” but it never loads. It works fine in other browsers. https://editor…

---

## [Materials not working on iPhone in 3D](https://discourse.processing.org/t/materials-not-working-on-iphone-in-3d/5006)

<div class="topic-metadata">

**Author:** [@sscotti](https://discourse.processing.org/u/sscotti)\
**Replies:** 2\
**Last updated:** [October 31, 2018, 6:51pm UTC](https://discourse.processing.org/t/materials-not-working-on-iphone-in-3d/5006 "2018-10-31T18:51:46Z")

</div>

On newer iPhones (8 and greater), the materials and shading in examples: https://p5js.org/examples/3d-multiple-lights.html https://p5js.org/examples/3d-materials.html https://p5js.org/examples/3d-textures.html are no…

---

## [Offscreen buffer offset weirdness - "works on THIS mac"](https://discourse.processing.org/t/offscreen-buffer-offset-weirdness-works-on-this-mac/4926)

<div class="topic-metadata">

**Author:** [@kirkjerk](https://discourse.processing.org/u/kirkjerk)\
**Replies:** 7\
**Last updated:** [October 31, 2018, 5:27pm UTC](https://discourse.processing.org/t/offscreen-buffer-offset-weirdness-works-on-this-mac/4926 "2018-10-31T17:27:00Z")

</div>

I made a version of A.K.Dewdney’s famous Wa-Tor - https://toys.alienbill.com/wator/index2.html I used instance mode, because I wanted to have the main cellular automata area send data to a seperate canvas for it to gra…

---

## [P5.js sketches with terrible framerate on chrome](https://discourse.processing.org/t/p5-js-sketches-with-terrible-framerate-on-chrome/499)

<div class="topic-metadata">

**Author:** [@colin](https://discourse.processing.org/u/colin)\
**Replies:** 19\
**Last updated:** [October 31, 2018, 3:06am UTC](https://discourse.processing.org/t/p5-js-sketches-with-terrible-framerate-on-chrome/499 "2018-10-31T03:06:23Z")

</div>

Hi, I developed several games using P5.js and I managed to make them work around 60fps. Sadly, I discovered that they’re working around 10fps on a lot of browsers including recent versions of chrome and safari. Here is …

---

## [Image filter example in a loop draw](https://discourse.processing.org/t/image-filter-example-in-a-loop-draw/4905)

<div class="topic-metadata">

**Author:** [@antocreo](https://discourse.processing.org/u/antocreo)\
**Replies:** 4\
**Last updated:** [October 30, 2018, 6:39pm UTC](https://discourse.processing.org/t/image-filter-example-in-a-loop-draw/4905 "2018-10-30T18:39:23Z")

</div>

Hi, I’ve been playing around with P5js and I am trying to use the image filter on an event like mouseMoved. I am having lot of trouble. The only examples I found use the filter in the setup function. so, how do you c…

---

## [Script error. (:line 0)](https://discourse.processing.org/t/script-error-line-0/4871)

<div class="topic-metadata">

**Author:** [@SebC](https://discourse.processing.org/u/SebC)\
**Replies:** 12\
**Last updated:** [October 26, 2018, 3:11pm UTC](https://discourse.processing.org/t/script-error-line-0/4871 "2018-10-26T15:11:35Z")

</div>

Hi, I’m just beginning with this library and I have trouble to start. When I play my code, I have a "Script error. (:line 0) " message in the console. I identified where the problem happpens in my code but I have no i…

---

## [P5.js // node server not working](https://discourse.processing.org/t/p5-js-node-server-not-working/4766)

<div class="topic-metadata">

**Author:** [@codingking03](https://discourse.processing.org/u/codingking03)\
**Replies:** 9\
**Last updated:** [October 25, 2018, 11:56pm UTC](https://discourse.processing.org/t/p5-js-node-server-not-working/4766 "2018-10-25T23:56:51Z")

</div>

Here I thought I copied these two videos exactly and it worked all the way until this moment of the second video. here is what I am seeing:

---

## [Need help for a small pong game](https://discourse.processing.org/t/need-help-for-a-small-pong-game/4882)

<div class="topic-metadata">

**Author:** [@Trey](https://discourse.processing.org/u/Trey)\
**Replies:** 3\
**Last updated:** [October 25, 2018, 10:26pm UTC](https://discourse.processing.org/t/need-help-for-a-small-pong-game/4882 "2018-10-25T22:26:03Z")

</div>

I’m trying to make it so that when the main ball goes through an area in the center of the canvas it spawns a several new, smaller balls that go in random directions. All I’ve been able to do is make a single new ball t…

---

## [saveTable creating new file instead of appending existing](https://discourse.processing.org/t/savetable-creating-new-file-instead-of-appending-existing/4858)

<div class="topic-metadata">

**Author:** [@zooto68](https://discourse.processing.org/u/zooto68)\
**Replies:** 1\
**Last updated:** [October 25, 2018, 7:47pm UTC](https://discourse.processing.org/t/savetable-creating-new-file-instead-of-appending-existing/4858 "2018-10-25T19:47:03Z")

</div>

Hi, I am trying to load in a file in my sketch folder using loadTable, add some data to the file and then save it back to the same file. However, the file is being downloaded in the browser to the default browser downlo…

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

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