# p5.js

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

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

**Page:** 105

---

## [Need help for a homework (should be ez for you )](https://discourse.processing.org/t/need-help-for-a-homework-should-be-ez-for-you/6082)

<div class="topic-metadata">

**Author:** [@Robin73](https://discourse.processing.org/u/Robin73)\
**Replies:** 9\
**Last updated:** [November 30, 2018, 1:26am UTC](https://discourse.processing.org/t/need-help-for-a-homework-should-be-ez-for-you/6082 "2018-11-30T01:26:55Z")

</div>

So i have to make spawn Random Howls with random abscissa, size, and grey shades. The problem is that they are spawning and they disappear and i don’t want them to disappear here’s the code. function setup(){ crea…

---

## [P5.js online reference broken](https://discourse.processing.org/t/p5-js-online-reference-broken/6060)

<div class="topic-metadata">

**Author:** [@ktorn](https://discourse.processing.org/u/ktorn)\
**Replies:** 2\
**Last updated:** [November 30, 2018, 1:09am UTC](https://discourse.processing.org/t/p5-js-online-reference-broken/6060 "2018-11-30T01:09:47Z")

</div>

Seems like the p5.js online reference (https://p5js.org/reference/) is currently broken, with console errors: https://p5js.org/assets/js/p5.min.js 404 (Not Found) https://p5js.org/assets/js/p5.dom.min.js 404 (Not Found)…

---

## [Gravity for 'mouse follow' function](https://discourse.processing.org/t/gravity-for-mouse-follow-function/6040)

<div class="topic-metadata">

**Author:** [@munr](https://discourse.processing.org/u/munr)\
**Replies:** 3\
**Last updated:** [November 29, 2018, 12:09am UTC](https://discourse.processing.org/t/gravity-for-mouse-follow-function/6040 "2018-11-29T00:09:22Z")

</div>

How might gravity be implemented for this drum beater so that it can swing and droop?: https://editor.p5js.org/munr/full/rkhA74j0Q var x = 100, y = 100, angle1 = 0.0, segLength = 45; function setup() { cre…

---

## [Question about state of image effects in p5.js](https://discourse.processing.org/t/question-about-state-of-image-effects-in-p5-js/6045)

<div class="topic-metadata">

**Author:** [@ogoossens](https://discourse.processing.org/u/ogoossens)\
**Replies:** 4\
**Last updated:** [November 28, 2018, 9:56pm UTC](https://discourse.processing.org/t/question-about-state-of-image-effects-in-p5-js/6045 "2018-11-28T21:56:24Z")

</div>

Hi, I have two questions regarding two effects and their possible use in P5.js - if its possible or if there are any workarounds if not directly. 1. MASKS: I would love to use MASKS (areas where images/geometries) ar…

---

## [WEBGL pointLight issue with Graphics buffer](https://discourse.processing.org/t/webgl-pointlight-issue-with-graphics-buffer/5969)

<div class="topic-metadata">

**Author:** [@r4nd0m](https://discourse.processing.org/u/r4nd0m)\
**Replies:** 1\
**Last updated:** [November 27, 2018, 4:04pm UTC](https://discourse.processing.org/t/webgl-pointlight-issue-with-graphics-buffer/5969 "2018-11-27T16:04:57Z")

</div>

Hi, does anyone know why the light source in this example is not changing position? Thanks! let gl; let offsetX = 0; function setup() { createCanvas(400, 400); gl = createGraphics(100, 100, WEBGL); } function draw(…

---

## [Debugging dodgeball game: “Cannot read property ‘x’ of undefined” when hit](https://discourse.processing.org/t/debugging-dodgeball-game-cannot-read-property-x-of-undefined-when-hit/5962)

<div class="topic-metadata">

**Author:** [@shoneyjosh](https://discourse.processing.org/u/shoneyjosh)\
**Replies:** 2\
**Last updated:** [November 26, 2018, 6:05pm UTC](https://discourse.processing.org/t/debugging-dodgeball-game-cannot-read-property-x-of-undefined-when-hit/5962 "2018-11-26T18:05:58Z")

</div>

I made a game where you need to dodge the dodgeballs and it says “Cannot read property ‘x’ of undefined” whenever I get hit by an enemy. Any ideas? var player; var enemies = \[\]; var score = 0; var gameState; var lives =…

---

## [Is there a way to use createCapture in React?](https://discourse.processing.org/t/is-there-a-way-to-use-createcapture-in-react/5955)

<div class="topic-metadata">

**Author:** [@cristiano](https://discourse.processing.org/u/cristiano)\
**Replies:** 3\
**Last updated:** [November 26, 2018, 3:58pm UTC](https://discourse.processing.org/t/is-there-a-way-to-use-createcapture-in-react/5955 "2018-11-26T15:58:07Z")

</div>

I’m attempting to draw a video along with a few shapes using p5.js on a React app. I’ve noticed that p5.dom.js is not available for React and probably for good reason. This stopped me from using createCapture(VIDEO) so …

---

## [Sliding matrix of circles, can't generate or fill new row of circles in 2D array](https://discourse.processing.org/t/sliding-matrix-of-circles-cant-generate-or-fill-new-row-of-circles-in-2d-array/5925)

<div class="topic-metadata">

**Author:** [@gio](https://discourse.processing.org/u/gio)\
**Replies:** 3\
**Last updated:** [November 26, 2018, 1:38pm UTC](https://discourse.processing.org/t/sliding-matrix-of-circles-cant-generate-or-fill-new-row-of-circles-in-2d-array/5925 "2018-11-26T13:38:22Z")

</div>

Hi am creating a 2D array of circles, which slides down every second. Right now if the height of the circles is bigger than the sketch height, it resets the height of the circles to the top. So, i generate once a grid …

---

## [Array question in JS](https://discourse.processing.org/t/array-question-in-js/5875)

<div class="topic-metadata">

**Author:** [@flamo](https://discourse.processing.org/u/flamo)\
**Replies:** 8\
**Last updated:** [November 25, 2018, 5:54am UTC](https://discourse.processing.org/t/array-question-in-js/5875 "2018-11-25T05:54:20Z")

</div>

I’m building a p5 library and I’m new to JavaScript. I’m confused by the JavaScript closure and array system. I don’t understand why I get undefined object “field” in for loops. Ps: I’m using the math.js eval to transla…

---

## [Full opacity of pixel alpha on image border](https://discourse.processing.org/t/full-opacity-of-pixel-alpha-on-image-border/5858)

<div class="topic-metadata">

**Author:** [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Replies:** 6\
**Last updated:** [November 25, 2018, 2:48am UTC](https://discourse.processing.org/t/full-opacity-of-pixel-alpha-on-image-border/5858 "2018-11-25T02:48:21Z")

</div>

I am seeing full opacity on the border of my image when painting pixels … why is this? My source image has 0 opacity around the edges. If you uncomment lines 21 and 27, and comment out line 52 you will see. In the prov…

---

## [Draw function not looping](https://discourse.processing.org/t/draw-function-not-looping/5694)

<div class="topic-metadata">

**Author:** [@Ramsayrex](https://discourse.processing.org/u/Ramsayrex)\
**Replies:** 4\
**Last updated:** [November 23, 2018, 9:36pm UTC](https://discourse.processing.org/t/draw-function-not-looping/5694 "2018-11-23T21:36:20Z")

</div>

I’m having issues with the draw function and I’m not sure whats causing them var theta = 0 var xcoor = 0 var ycoor = 0 var xint1 = 0 var xint2 = 0 var yint1 = 0 var yint2 = 0 var r = 10 var radius = r\*10 function setu…

---

## [Uneven distrobution instead of normal map()](https://discourse.processing.org/t/uneven-distrobution-instead-of-normal-map/5791)

<div class="topic-metadata">

**Author:** [@noFun](https://discourse.processing.org/u/noFun)\
**Replies:** 3\
**Last updated:** [November 21, 2018, 12:05pm UTC](https://discourse.processing.org/t/uneven-distrobution-instead-of-normal-map/5791 "2018-11-21T12:05:32Z")

</div>

If you use something like map(n,0,100, 0,200), it will map things evenly. 0 maps to 0, 100 maps to 200, and each integer in-between is evenly spaced. But what if you don’t want the mapping to be as even? As in, when lowe…

---

## [Modyfing headers in P5 HttpPost request?](https://discourse.processing.org/t/modyfing-headers-in-p5-httppost-request/5713)

<div class="topic-metadata">

**Author:** [@Noxid](https://discourse.processing.org/u/Noxid)\
**Replies:** 2\
**Last updated:** [November 20, 2018, 4:55am UTC](https://discourse.processing.org/t/modyfing-headers-in-p5-httppost-request/5713 "2018-11-20T04:55:56Z")

</div>

Is it possible to modify the headers of an httpPost request made trough the httpPost() function in P5?For example adding a http authorization header?

---

## [Rotate a Sphere to have a point on the surface be centered on screen](https://discourse.processing.org/t/rotate-a-sphere-to-have-a-point-on-the-surface-be-centered-on-screen/5712)

<div class="topic-metadata">

**Author:** [@FedFod](https://discourse.processing.org/u/FedFod)\
**Replies:** 2\
**Last updated:** [November 20, 2018, 4:50am UTC](https://discourse.processing.org/t/rotate-a-sphere-to-have-a-point-on-the-surface-be-centered-on-screen/5712 "2018-11-20T04:50:25Z")

</div>

Hi all, this is the scenario: I have a sphere made up of an array of vec3 vertices. When I click a button, I want that the whole sphere rotates in a way that the vertex I selected gets positioned in the center of the s…

---

## [What's going on under the hood with p5js?](https://discourse.processing.org/t/whats-going-on-under-the-hood-with-p5js/5703)

<div class="topic-metadata">

**Author:** [@davidj](https://discourse.processing.org/u/davidj)\
**Replies:** 7\
**Last updated:** [November 20, 2018, 12:20am UTC](https://discourse.processing.org/t/whats-going-on-under-the-hood-with-p5js/5703 "2018-11-20T00:20:10Z")

</div>

I’m new to processing/p5.js, but not new to javascript/web development. If you’re interested, here’s a generative art project I created with a library I created from scratch - based on HTML5 canvas. Something that seems…

---

## [curvePoint() documentation?](https://discourse.processing.org/t/curvepoint-documentation/5601)

<div class="topic-metadata">

**Author:** [@mzed](https://discourse.processing.org/u/mzed)\
**Replies:** 3\
**Last updated:** [November 20, 2018, 12:15am UTC](https://discourse.processing.org/t/curvepoint-documentation/5601 "2018-11-20T00:15:52Z")

</div>

I’m pretty sure that the documentation for the curvePoint() function in p5.js is wrong. Am I crazy? It is here: https://p5js.org/reference/#/p5/curvePoint I think the parameters should be: Parameters a Number: coordi…

---

## [Array of Lines that move different to each other Perlin Noise](https://discourse.processing.org/t/array-of-lines-that-move-different-to-each-other-perlin-noise/5564)

<div class="topic-metadata">

**Author:** [@ronantuite](https://discourse.processing.org/u/ronantuite)\
**Replies:** 5\
**Last updated:** [November 19, 2018, 5:45pm UTC](https://discourse.processing.org/t/array-of-lines-that-move-different-to-each-other-perlin-noise/5564 "2018-11-19T17:45:55Z")

</div>

I have a sketch that makes a multiple of vertex lines using beginShape(); and endShape();. They move using Perlin Noise. My problem is that I want each line to move differently while at this moment they all have the same…

---

## [Newbie question: can't load JSON with url](https://discourse.processing.org/t/newbie-question-cant-load-json-with-url/5665)

<div class="topic-metadata">

**Author:** [@Ivano](https://discourse.processing.org/u/Ivano)\
**Replies:** 7\
**Last updated:** [November 19, 2018, 8:30am UTC](https://discourse.processing.org/t/newbie-question-cant-load-json-with-url/5665 "2018-11-19T08:30:14Z")

</div>

Hi I manage to solve all of the problems i encountered on my own, by reading reference page, googling, by watching yt tutorials… but i have problem with loading JSON with url which is not working even thought I done eve…

---

## [Save sound p5.sound](https://discourse.processing.org/t/save-sound-p5-sound/1985)

<div class="topic-metadata">

**Author:** [@sribarr](https://discourse.processing.org/u/sribarr)\
**Replies:** 1\
**Last updated:** [November 18, 2018, 9:28pm UTC](https://discourse.processing.org/t/save-sound-p5-sound/1985 "2018-11-18T21:28:55Z")

</div>

How to save sound recordings to a different folder other than the downloads

---

## [Walking removes scale of snake](https://discourse.processing.org/t/walking-removes-scale-of-snake/1657)

<div class="topic-metadata">

**Author:** [@ville2008](https://discourse.processing.org/u/ville2008)\
**Replies:** 1\
**Last updated:** [November 18, 2018, 9:24pm UTC](https://discourse.processing.org/t/walking-removes-scale-of-snake/1657 "2018-11-18T21:24:50Z")

</div>

when i play my game and eat a food and then move it sometimes removes my scale heres my source code sketch source: (where my move runs) var s; var scl = 20; var food = 20; var foods = 0; var foodU = foods; functio…

---

## [Ask google for gps by giving street adress?](https://discourse.processing.org/t/ask-google-for-gps-by-giving-street-adress/5585)

<div class="topic-metadata">

**Author:** [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Replies:** 6\
**Last updated:** [November 17, 2018, 7:41pm UTC](https://discourse.processing.org/t/ask-google-for-gps-by-giving-street-adress/5585 "2018-11-17T19:41:45Z")

</div>

How can I Ask google for gps by giving street adress? I got a bunch of Adresses and like to retrieve the gps data for the houses. Adresses are from germany like street, house number, zip code, city. Thanks a ton! Chr…

---

## [Wait until Canvas gets created in DOM](https://discourse.processing.org/t/wait-until-canvas-gets-created-in-dom/5602)

<div class="topic-metadata">

**Author:** [@FedFod](https://discourse.processing.org/u/FedFod)\
**Replies:** 2\
**Last updated:** [November 16, 2018, 3:42pm UTC](https://discourse.processing.org/t/wait-until-canvas-gets-created-in-dom/5602 "2018-11-16T15:42:13Z")

</div>

Hi all, I have this code: canvas2 = mCreateCanvas(m4.windowWidth, m4.windowHeight, m4.WEBGL); m4.setAttributes('antialias', true); glCanvas = document.getElementById('defaultCanvas0').getContext('webgl'); …

---

## [hint(DISABLE\_DEPTH\_TEST) in P5](https://discourse.processing.org/t/hint-disable-depth-test-in-p5/5595)

<div class="topic-metadata">

**Author:** [@FedFod](https://discourse.processing.org/u/FedFod)\
**Replies:** 13\
**Last updated:** [November 16, 2018, 3:30pm UTC](https://discourse.processing.org/t/hint-disable-depth-test-in-p5/5595 "2018-11-16T15:30:34Z")

</div>

Hey everybody, do you know how to get the same functionality of the hint function in P5? Cannot seem to find it anywhere. Thank you!

---

## [P5.js - Mouse and keys stuck](https://discourse.processing.org/t/p5-js-mouse-and-keys-stuck/5556)

<div class="topic-metadata">

**Author:** [@Sarah](https://discourse.processing.org/u/Sarah)\
**Replies:** 12\
**Last updated:** [November 16, 2018, 10:02am UTC](https://discourse.processing.org/t/p5-js-mouse-and-keys-stuck/5556 "2018-11-16T10:02:19Z")

</div>

Hi, I’ve been experimenting with p5.js for a bit, and I’ve noticed that the mouse and key functions sometimes get stuck. The problem is caused for me when you right-click, or hold a key, then right-click. (In the sketc…

---

## [What to do about variables that are not assigned in a class?](https://discourse.processing.org/t/what-to-do-about-variables-that-are-not-assigned-in-a-class/5517)

<div class="topic-metadata">

**Author:** [@yangs](https://discourse.processing.org/u/yangs)\
**Replies:** 6\
**Last updated:** [November 16, 2018, 2:56am UTC](https://discourse.processing.org/t/what-to-do-about-variables-that-are-not-assigned-in-a-class/5517 "2018-11-16T02:56:18Z")

</div>

Hi all! I’m trying to convert Daniel Shiffman’s sine wave example to a class so I can have multiple instances of it. However, when I start creating the class: class Wave { constructor(){ this.xspacing = 20; t…

---

## [Using p5.js functions with Node.js](https://discourse.processing.org/t/using-p5-js-functions-with-node-js/5431)

<div class="topic-metadata">

**Author:** [@Sarah](https://discourse.processing.org/u/Sarah)\
**Replies:** 2\
**Last updated:** [November 14, 2018, 8:11am UTC](https://discourse.processing.org/t/using-p5-js-functions-with-node-js/5431 "2018-11-14T08:11:51Z")

</div>

Hi, I’ve been experimenting with Node.js and socket.io, and I am now trying to use them together by making a simple shooter game. Currently, I have a server file, which handles all the game logic and updates the game (…

---

## [Offline video masking](https://discourse.processing.org/t/offline-video-masking/5495)

<div class="topic-metadata">

**Author:** [@dirkk0](https://discourse.processing.org/u/dirkk0)\
**Replies:** 0\
**Last updated:** [November 13, 2018, 12:39pm UTC](https://discourse.processing.org/t/offline-video-masking/5495 "2018-11-13T12:39:06Z")

</div>

Hi, is there a way to load a video, mask it and create a new, already masked video from it? Thanks, Dirk

---

## [Resize canvas from windowResize() distorts proportions of 3D objects](https://discourse.processing.org/t/resize-canvas-from-windowresize-distorts-proportions-of-3d-objects/5492)

<div class="topic-metadata">

**Author:** [@FedFod](https://discourse.processing.org/u/FedFod)\
**Replies:** 0\
**Last updated:** [November 13, 2018, 12:08pm UTC](https://discourse.processing.org/t/resize-canvas-from-windowresize-distorts-proportions-of-3d-objects/5492 "2018-11-13T12:08:38Z")

</div>

Hi everybody, so when I resize the canvas in this way: m4.windowResized = function() { m4.resizeCanvas(m4.windowWidth, m4.windowHeight); // sphereVertices = pointsOnSphere(etiquetasLength); } the 3D objects on my w…

---

## [Animation frames overwrite themselves. Why?](https://discourse.processing.org/t/animation-frames-overwrite-themselves-why/5452)

<div class="topic-metadata">

**Author:** [@Arnoldovna](https://discourse.processing.org/u/Arnoldovna)\
**Replies:** 3\
**Last updated:** [November 12, 2018, 9:55pm UTC](https://discourse.processing.org/t/animation-frames-overwrite-themselves-why/5452 "2018-11-12T21:55:34Z")

</div>

I am using a video input to draw onto a canvas in order to get the color of the pixel in the very middle of the canvas. With the recent code I have the pixel color and pass it as a color value to draw a line. This line …

---

## [Loading Video from URL?](https://discourse.processing.org/t/loading-video-from-url/5480)

<div class="topic-metadata">

**Author:** [@Arnoldovna](https://discourse.processing.org/u/Arnoldovna)\
**Replies:** 3\
**Last updated:** [November 12, 2018, 7:15pm UTC](https://discourse.processing.org/t/loading-video-from-url/5480 "2018-11-12T19:15:32Z")

</div>

hello. Im trying to create a Video with createVideo() from a youtube URL. In order to draw it on a canvas later on. Is this possible? I saw something like this “URL.createObjectURL”. Is this pointing in the right direc…

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

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