# p5.js

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

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

**Page:** 110

---

## [A begginer having a problem when using p5.gif.js](https://discourse.processing.org/t/a-begginer-having-a-problem-when-using-p5-gif-js/3002)

<div class="topic-metadata">

**Author:** [@JChan](https://discourse.processing.org/u/JChan)\
**Replies:** 6\
**Last updated:** [August 27, 2018, 3:43am UTC](https://discourse.processing.org/t/a-begginer-having-a-problem-when-using-p5-gif-js/3002 "2018-08-27T03:43:45Z")

</div>

hi everyone, i’m a beginner of P5js i face a problem when i using p5.gif.js library to display a gif, https://github.com/antiboredom/p5.gif.js/tree/master below is my code: var gif; function setup() { createCanva…

---

## [P5 crashes chrome](https://discourse.processing.org/t/p5-crashes-chrome/2770)

<div class="topic-metadata">

**Author:** [@Quillbert1](https://discourse.processing.org/u/Quillbert1)\
**Replies:** 16\
**Last updated:** [August 26, 2018, 6:48pm UTC](https://discourse.processing.org/t/p5-crashes-chrome/2770 "2018-08-26T18:48:30Z")

</div>

Whenever I try to run a p5.js sketch in chrome, whether it’s the web editor, the html file, or opening a server with the p5.js mode in processing, I get a "this application has stopped working pop-up, and all chrome wind…

---

## [Requirements for p5.js Web Editor](https://discourse.processing.org/t/requirements-for-p5-js-web-editor/2913)

<div class="topic-metadata">

**Author:** [@ziebarth](https://discourse.processing.org/u/ziebarth)\
**Replies:** 5\
**Last updated:** [August 24, 2018, 9:43pm UTC](https://discourse.processing.org/t/requirements-for-p5-js-web-editor/2913 "2018-08-24T21:43:32Z")

</div>

Hello, I would like to use the p5.js Web Editor for introducing programming in 2 courses at my school. Unfortunately, I only get an empty page (it contains some divs that are not displayed) when I try to load the editor…

---

## [Launch the function loadJSON() with a html button](https://discourse.processing.org/t/launch-the-function-loadjson-with-a-html-button/2802)

<div class="topic-metadata">

**Author:** [@mloiz](https://discourse.processing.org/u/mloiz)\
**Replies:** 11\
**Last updated:** [August 22, 2018, 3:26pm UTC](https://discourse.processing.org/t/launch-the-function-loadjson-with-a-html-button/2802 "2018-08-22T15:26:16Z")

</div>

Hello, I would like to launch a loadJSON() function with an html input element. below is my code, it should work but I have this error : NetworkError when attempting to fetch resource … how to resolve it ? \<!DOCTYPE …

---

## [How to test which button is checked of an existing radio buttons family?](https://discourse.processing.org/t/how-to-test-which-button-is-checked-of-an-existing-radio-buttons-family/2849)

<div class="topic-metadata">

**Author:** [@Laurent](https://discourse.processing.org/u/Laurent)\
**Replies:** 2\
**Last updated:** [August 22, 2018, 2:07pm UTC](https://discourse.processing.org/t/how-to-test-which-button-is-checked-of-an-existing-radio-buttons-family/2849 "2018-08-22T14:07:01Z")

</div>

Hi everyone. I’m used to write my own statitc html code into the index.html file of p5.js sketch. So I use the select() function of the DOM library to access html elements such INPUT of type text/passwordor or SELECT htm…

---

## [\#BackToSchoolwithp5js Twitter Chat](https://discourse.processing.org/t/backtoschoolwithp5js-twitter-chat/2845)

<div class="topic-metadata">

**Author:** [@saberkhan](https://discourse.processing.org/u/saberkhan)\
**Replies:** 0\
**Last updated:** [August 22, 2018, 11:23am UTC](https://discourse.processing.org/t/backtoschoolwithp5js-twitter-chat/2845 "2018-08-22T11:23:08Z")

</div>

Hi, Next Wednesday, August 29 at 8 pm ET / 5 pm PT, I am hosting a Twitter chat with members of the p5.js community to talk about using p5.js in the classroom with @lmccart, @shiffman, @cassie, Luisa Pereira, and Jose O…

---

## [Working with mouseDragged() and other mouse events inside a class](https://discourse.processing.org/t/working-with-mousedragged-and-other-mouse-events-inside-a-class/2829)

<div class="topic-metadata">

**Author:** [@tony](https://discourse.processing.org/u/tony)\
**Replies:** 5\
**Last updated:** [August 22, 2018, 7:38am UTC](https://discourse.processing.org/t/working-with-mousedragged-and-other-mouse-events-inside-a-class/2829 "2018-08-22T07:38:08Z")

</div>

I usually work with the philosophy of “code now, fix later”. However, in my recent work, I’ve been trying to plan out my code ahead of time. So my question right now is, what’s the best way for working with mouseDragged(…

---

## [How to make a loading icon with an svg file p5.js (Access to Image at '' from origin 'null' has been blocked by CORS policy: Invalid response. Origin 'null' is therefore not allowed access](https://discourse.processing.org/t/how-to-make-a-loading-icon-with-an-svg-file-p5-js-access-to-image-at-from-origin-null-has-been-blocked-by-cors-policy-invalid-response-origin-null-is-therefore-not-allowed-access/2399)

<div class="topic-metadata">

**Author:** [@Pork](https://discourse.processing.org/u/Pork)\
**Replies:** 7\
**Last updated:** [August 21, 2018, 10:09pm UTC](https://discourse.processing.org/t/how-to-make-a-loading-icon-with-an-svg-file-p5-js-access-to-image-at-from-origin-null-has-been-blocked-by-cors-policy-invalid-response-origin-null-is-therefore-not-allowed-access/2399 "2018-08-21T22:09:44Z")

</div>

idk how to load the svg file. When i try i get a “Access to Image at ‘’ from origin ‘null’ has been blocked by CORS policy: Invalid response. Origin ‘null’ is therefore not allowed access.” If svg filetypes aren’t suppo…

---

## [API Key in header?](https://discourse.processing.org/t/api-key-in-header/2817)

<div class="topic-metadata">

**Author:** [@LWoodall](https://discourse.processing.org/u/LWoodall)\
**Replies:** 3\
**Last updated:** [August 21, 2018, 2:01pm UTC](https://discourse.processing.org/t/api-key-in-header/2817 "2018-08-21T14:01:19Z")

</div>

Hi I’ve been following tutorials for using p5.js to access data through APIs. So far i’ve been getting along fine with the tutorials (Coding Train) but now i’m looking at the Bungie API test (http://destinydevs.github.i…

---

## [\[SOLVED\] Accessing html elements defined into .html file?](https://discourse.processing.org/t/solved-accessing-html-elements-defined-into-html-file/2701)

<div class="topic-metadata">

**Author:** [@Laurent](https://discourse.processing.org/u/Laurent)\
**Replies:** 2\
**Last updated:** [August 21, 2018, 8:56am UTC](https://discourse.processing.org/t/solved-accessing-html-elements-defined-into-html-file/2701 "2018-08-21T08:56:51Z")

</div>

Hi everyone, Is there a way to access already existing HTML element defined in the .html page of a p5.js project? For instance, I’d like to be able to read the text value of an HTML input element. I know that the p5.dom…

---

## [Retrieve online JSON data](https://discourse.processing.org/t/retrieve-online-json-data/2784)

<div class="topic-metadata">

**Author:** [@mloiz](https://discourse.processing.org/u/mloiz)\
**Replies:** 3\
**Last updated:** [August 20, 2018, 3:37pm UTC](https://discourse.processing.org/t/retrieve-online-json-data/2784 "2018-08-20T15:37:07Z")

</div>

Hello, I would like to retrieve some online JSON data, and I dont manage. first, I cannont print the row data ; then, what are the equivalents of getJSONObject and getJSONArray from Processing ? Indeed I have to go a…

---

## [\[SOLVED\] \[p5.dom\] Problem loading video](https://discourse.processing.org/t/solved-p5-dom-problem-loading-video/2734)

<div class="topic-metadata">

**Author:** [@Laurent](https://discourse.processing.org/u/Laurent)\
**Replies:** 3\
**Last updated:** [August 18, 2018, 3:36pm UTC](https://discourse.processing.org/t/solved-p5-dom-problem-loading-video/2734 "2018-08-18T15:36:09Z")

</div>

Hi everyone. I don’t know what I’m doing wrong when loading a video (in order to display it just after loading). Here is my .js and .html code: js.code function preload() { vid = createVideo('videos/20th\_Century\_St…

---

## [Transparent texture for plane in Webgl..?](https://discourse.processing.org/t/transparent-texture-for-plane-in-webgl/2748)

<div class="topic-metadata">

**Author:** [@bennyt](https://discourse.processing.org/u/bennyt)\
**Replies:** 1\
**Last updated:** [August 18, 2018, 12:42pm UTC](https://discourse.processing.org/t/transparent-texture-for-plane-in-webgl/2748 "2018-08-18T12:42:58Z")

</div>

I’m trying to apply a transparent png texture to a plane, but it’s not happening. There is no transparency… Does any one know what can be done?

---

## [Can't find p5.js Editor](https://discourse.processing.org/t/cant-find-p5-js-editor/2730)

<div class="topic-metadata">

**Author:** [@stopyunn](https://discourse.processing.org/u/stopyunn)\
**Replies:** 4\
**Last updated:** [August 18, 2018, 12:53am UTC](https://discourse.processing.org/t/cant-find-p5-js-editor/2730 "2018-08-18T00:53:20Z")

</div>

Hey, I just started to take a course on ‘Nature of Code’, and this course required a download of p5.js editor. But for some reasons, I can’t find the p5.js editor in the ‘download’. Here: https://p5js.org/download/ Di…

---

## [Line inside for() wont go behind image](https://discourse.processing.org/t/line-inside-for-wont-go-behind-image/2736)

<div class="topic-metadata">

**Author:** [@leo](https://discourse.processing.org/u/leo)\
**Replies:** 5\
**Last updated:** [August 17, 2018, 10:29pm UTC](https://discourse.processing.org/t/line-inside-for-wont-go-behind-image/2736 "2018-08-17T22:29:17Z")

</div>

Hello everyone,can someone help me with this codepen? I can’t get the lines to go behind the big central circle, even putting the center image before the for(). var canvas; var width = window.innerWidth; var height = wi…

---

## [Multiplayer game stops working when i use background();](https://discourse.processing.org/t/multiplayer-game-stops-working-when-i-use-background/2628)

<div class="topic-metadata">

**Author:** [@ville2008](https://discourse.processing.org/u/ville2008)\
**Replies:** 11\
**Last updated:** [August 15, 2018, 4:25am UTC](https://discourse.processing.org/t/multiplayer-game-stops-working-when-i-use-background/2628 "2018-08-15T04:25:03Z")

</div>

i have a multiplayer game that im working on but when i moved i got bigger instead off moving so i used background(); in draw and then the multiplayer aspect stopped working help i am using kinda messy code cus im just t…

---

## [P5.dom 4.0 bug, example does not work](https://discourse.processing.org/t/p5-dom-4-0-bug-example-does-not-work/2566)

<div class="topic-metadata">

**Author:** [@mirzababaei](https://discourse.processing.org/u/mirzababaei)\
**Replies:** 4\
**Last updated:** [August 12, 2018, 3:53pm UTC](https://discourse.processing.org/t/p5-dom-4-0-bug-example-does-not-work/2566 "2018-08-12T15:53:47Z")

</div>

hi https://p5js.org/examples/dom-input-and-button.html does not work after recent version update.

---

## [ipCapture in p5](https://discourse.processing.org/t/ipcapture-in-p5/2307)

<div class="topic-metadata">

**Author:** [@TTG](https://discourse.processing.org/u/TTG)\
**Replies:** 3\
**Last updated:** [August 4, 2018, 8:12pm UTC](https://discourse.processing.org/t/ipcapture-in-p5/2307 "2018-08-04T20:12:23Z")

</div>

Dear team, i have an issue connecting my IP camera to the p5 environment. p5 works with " capture = createCapture(VIDEO);" in order to access a webcam Processing 3 has the function ipcapture which allows me to access …

---

## [Loading images sometimes works and sometimes doesn't](https://discourse.processing.org/t/loading-images-sometimes-works-and-sometimes-doesnt/2562)

<div class="topic-metadata">

**Author:** [@Pork](https://discourse.processing.org/u/Pork)\
**Replies:** 3\
**Last updated:** [August 11, 2018, 8:23pm UTC](https://discourse.processing.org/t/loading-images-sometimes-works-and-sometimes-doesnt/2562 "2018-08-11T20:23:25Z")

</div>

Here’s what I’m trying to do. Sometimes when you refresh it works just fine. Sometimes I get this error: If you can’t see its says: Uncaught TypeError: Cannot read property ‘width’ of undefined at e.image (p5.min…

---

## [Orientation / motion sensors deprecated](https://discourse.processing.org/t/orientation-motion-sensors-deprecated/1640)

<div class="topic-metadata">

**Author:** [@zackpi](https://discourse.processing.org/u/zackpi)\
**Replies:** 3\
**Last updated:** [August 11, 2018, 12:14pm UTC](https://discourse.processing.org/t/orientation-motion-sensors-deprecated/1640 "2018-08-11T12:14:45Z")

</div>

Hi, this is my first time using p5.js and javascript for that matter. But I came upon this warning/error while running this code from one of the getting started pages on the p5.js website: function setup() { createCanv…

---

## [Display multiple webcam captures](https://discourse.processing.org/t/display-multiple-webcam-captures/2485)

<div class="topic-metadata">

**Author:** [@aliluyabt](https://discourse.processing.org/u/aliluyabt)\
**Replies:** 0\
**Last updated:** [August 8, 2018, 6:34pm UTC](https://discourse.processing.org/t/display-multiple-webcam-captures/2485 "2018-08-08T18:34:47Z")

</div>

Hi, is there a way to display two different webcam captures in one page?? Thanks a lot for a hint! Tried this one but did not work:

---

## [Error: Failed to load resource: net::ERR\_CONNECTION\_REFUSED](https://discourse.processing.org/t/error-failed-to-load-resource-net-err-connection-refused/2486)

<div class="topic-metadata">

**Author:** [@aliluyabt](https://discourse.processing.org/u/aliluyabt)\
**Replies:** 0\
**Last updated:** [August 8, 2018, 7:15pm UTC](https://discourse.processing.org/t/error-failed-to-load-resource-net-err-connection-refused/2486 "2018-08-08T19:15:56Z")

</div>

trying to run :https://github.com/ITPNYU/ICM-2015/blob/master/09\_video\_sound/02\_capture/13\_get\_sources/sketch.js but I keep getting this error Any ideas why??

---

## [\[SOLVED\] Unable to draw the offscreen buffer to the screen with image()](https://discourse.processing.org/t/solved-unable-to-draw-the-offscreen-buffer-to-the-screen-with-image/1530)

<div class="topic-metadata">

**Author:** [@Laurent](https://discourse.processing.org/u/Laurent)\
**Replies:** 6\
**Last updated:** [August 8, 2018, 11:16am UTC](https://discourse.processing.org/t/solved-unable-to-draw-the-offscreen-buffer-to-the-screen-with-image/1530 "2018-08-08T11:16:27Z")

</div>

Solved: see answer below Hi everyone. I’m trying to adapt the nice Yutaka Kachi’s Turtle Graphics project (https://ycatch.github.io/p5.turtle.js/) for Processing in p5.js mode. I’d like that my students could program t…

---

## [Video autoplay fails in Chrome: "play() failed because the user didn't interact with the document first"](https://discourse.processing.org/t/video-autoplay-fails-in-chrome-play-failed-because-the-user-didnt-interact-with-the-document-first/1726)

<div class="topic-metadata">

**Author:** [@Laurent](https://discourse.processing.org/u/Laurent)\
**Replies:** 2\
**Last updated:** [August 8, 2018, 11:03am UTC](https://discourse.processing.org/t/video-autoplay-fails-in-chrome-play-failed-because-the-user-didnt-interact-with-the-document-first/1726 "2018-08-08T11:03:42Z")

</div>

Hi everyone. Under recent Google Chrome version (for instance 67.0.3396.99 (Official Build) (64-bit) it is not possible to play a video immediately after the program is started (that means the ‘index.html’ file and .js …

---

## [getElementById is not a function - styling elements made in p5.js](https://discourse.processing.org/t/getelementbyid-is-not-a-function-styling-elements-made-in-p5-js/2456)

<div class="topic-metadata">

**Author:** [@LWoodall](https://discourse.processing.org/u/LWoodall)\
**Replies:** 1\
**Last updated:** [August 7, 2018, 9:13pm UTC](https://discourse.processing.org/t/getelementbyid-is-not-a-function-styling-elements-made-in-p5-js/2456 "2018-08-07T21:13:03Z")

</div>

var url1 = 'https://api.wordnik.com/v4/word.json/'; var word = 'vinyl'; var url2 = '/examples?includeDuplicates=false&useCanonical=false&limit=5&api\_key=MY\_API\_KEY'; var input; var submit; var example; function setup() …

---

## [Multi line Text box needed!](https://discourse.processing.org/t/multi-line-text-box-needed/2318)

<div class="topic-metadata">

**Author:** [@codingking03](https://discourse.processing.org/u/codingking03)\
**Replies:** 16\
**Last updated:** [August 6, 2018, 1:37am UTC](https://discourse.processing.org/t/multi-line-text-box-needed/2318 "2018-08-06T01:37:24Z")

</div>

Is there any function for a multi line textbox input? like createInput() but in paragraph form like the one im typing in right now

---

## [Is TRIANGLE\_STRIP working correctly in WEBGL?](https://discourse.processing.org/t/is-triangle-strip-working-correctly-in-webgl/2381)

<div class="topic-metadata">

**Author:** [@binkpitch](https://discourse.processing.org/u/binkpitch)\
**Replies:** 2\
**Last updated:** [August 5, 2018, 4:06pm UTC](https://discourse.processing.org/t/is-triangle-strip-working-correctly-in-webgl/2381 "2018-08-05T16:06:25Z")

</div>

The TRIANGLE\_STRIP is suppose look like the one in the document (https://p5js.org/reference/#/p5/beginShape). But, when I tried in WEBGL it look different, some points are not connected to each other. (https://alpha.edi…

---

## [CC Fest LA at UCLA on September 8](https://discourse.processing.org/t/cc-fest-la-at-ucla-on-september-8/2187)

<div class="topic-metadata">

**Author:** [@saberkhan](https://discourse.processing.org/u/saberkhan)\
**Replies:** 1\
**Last updated:** [August 4, 2018, 10:54pm UTC](https://discourse.processing.org/t/cc-fest-la-at-ucla-on-september-8/2187 "2018-08-04T22:54:27Z")

</div>

Hi peeps, CC Fest LA, a celebration for creative coding for students and teachers, will be back at UCLA on September 8, Saturday. It is a free, accessible, and diverse event for K12 students and teachers to engage with …

---

## [P5 loadSound not defined](https://discourse.processing.org/t/p5-loadsound-not-defined/2291)

<div class="topic-metadata">

**Author:** [@NycGio](https://discourse.processing.org/u/NycGio)\
**Replies:** 3\
**Last updated:** [August 2, 2018, 9:40am UTC](https://discourse.processing.org/t/p5-loadsound-not-defined/2291 "2018-08-02T09:40:42Z")

</div>

I keep getting an error saying loadSound is not defined here is my code if anyone can help me out. index.html \<!DOCTYPE html\> \<html lang="en"\> \<head\> \<meta charset="UTF-8"\> \<meta name="viewport" content="width=dev…

---

## [Wrong item in array is being edited (I think), p5.js. Help!](https://discourse.processing.org/t/wrong-item-in-array-is-being-edited-i-think-p5-js-help/2275)

<div class="topic-metadata">

**Author:** [@will821](https://discourse.processing.org/u/will821)\
**Replies:** 2\
**Last updated:** [August 1, 2018, 6:04pm UTC](https://discourse.processing.org/t/wrong-item-in-array-is-being-edited-i-think-p5-js-help/2275 "2018-08-01T18:04:30Z")

</div>

Hi there, I’m trying to make an array of objects which will change fill when the mouse is inside the object. I have got it to work when it was a single object but now there are multiple there is a bug which is filling a…

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

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