# Beginners

**URL:** https://discourse.processing.org/c/p5js/p5js-beginners/16.md?page=15

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

**Page:** 16

---

## [Cannot Create Classes](https://discourse.processing.org/t/cannot-create-classes/8756)

<div class="topic-metadata">

**Author:** [@Martin](https://discourse.processing.org/u/Martin)\
**Replies:** 17\
**Last updated:** [May 7, 2019, 9:16pm UTC](https://discourse.processing.org/t/cannot-create-classes/8756 "2019-05-07T21:16:57Z")

</div>

Good morning, people! Recently, I’ve been wresting with one small issue and honestly, it’s really starting to frustrate me. Perhaps it’s a small issue and I’m just going to look stupid, but at this rate, I might as well …

---

## [How to handle the undefined](https://discourse.processing.org/t/how-to-handle-the-undefined/10552)

<div class="topic-metadata">

**Author:** [@Aesahaettr](https://discourse.processing.org/u/Aesahaettr)\
**Replies:** 3\
**Last updated:** [April 23, 2019, 5:37pm UTC](https://discourse.processing.org/t/how-to-handle-the-undefined/10552 "2019-04-23T17:37:08Z")

</div>

Hello, I have been strugling with some variables that are the type of undefined. I’ve looked on internet but I found nothing on how to determine if it’s “undefined” like this : if (typeof tmp == "undefined") { tmp =…

---

## [Assignment operator](https://discourse.processing.org/t/assignment-operator/10249)

<div class="topic-metadata">

**Author:** [@jdk](https://discourse.processing.org/u/jdk)\
**Replies:** 5\
**Last updated:** [April 17, 2019, 4:48am UTC](https://discourse.processing.org/t/assignment-operator/10249 "2019-04-17T04:48:44Z")

</div>

I was preparing simple animation game of bouncing ball. There I have to insert an assignment condition for collision with a paddle to bounce. But it seems that p5js isn’t compatible with assignment operator. Its not …

---

## [Mapping Shapes to a Multi-Color Gradient](https://discourse.processing.org/t/mapping-shapes-to-a-multi-color-gradient/619)

<div class="topic-metadata">

**Author:** [@scoyoh](https://discourse.processing.org/u/scoyoh)\
**Replies:** 1\
**Last updated:** [June 4, 2018, 1:36am UTC](https://discourse.processing.org/t/mapping-shapes-to-a-multi-color-gradient/619 "2018-06-04T01:36:25Z")

</div>

Hi guys! I’m working on a music visualizer which was a fork from a great one I found on openprocessing. I just wanted to make a small change: Right now, each of the bars around the circle cycle straight through the RGB…

---

## [mousePressed() function](https://discourse.processing.org/t/mousepressed-function/9714)

<div class="topic-metadata">

**Author:** [@Neo\_Wang](https://discourse.processing.org/u/Neo_Wang)\
**Replies:** 11\
**Last updated:** [April 9, 2019, 10:45am UTC](https://discourse.processing.org/t/mousepressed-function/9714 "2019-04-09T10:45:11Z")

</div>

Hi there, from my understanding is that code within the mousePressed() function will be triggered when mouse is pressed down.however, what I was trying to do was draw a circle at a point on canvas when mouse is being pre…

---

## [P5.js TWO\_PI not working?](https://discourse.processing.org/t/p5-js-two-pi-not-working/9439)

<div class="topic-metadata">

**Author:** [@Code\_Caffeine](https://discourse.processing.org/u/Code_Caffeine)\
**Replies:** 3\
**Last updated:** [March 31, 2019, 4:39pm UTC](https://discourse.processing.org/t/p5-js-two-pi-not-working/9439 "2019-03-31T16:39:05Z")

</div>

I am trying to make a clock in p5.js after watching the Coding Train video on the topic. However, when I try to create an arc, the angle TWO\_PI produces no output, where I expect a full circle. Every other angle I have t…

---

## [Hex color in p5js web editor](https://discourse.processing.org/t/hex-color-in-p5js-web-editor/9762)

<div class="topic-metadata">

**Author:** [@Leo\_Aguiar](https://discourse.processing.org/u/Leo_Aguiar)\
**Replies:** 6\
**Last updated:** [March 31, 2019, 3:43pm UTC](https://discourse.processing.org/t/hex-color-in-p5js-web-editor/9762 "2019-03-31T15:43:27Z")

</div>

Hi forum, Why does this not work in the p5js web editor? function setup() { createCanvas(400, 400); } function draw() { background(220); let c1 = color('#f92804'); fill(c1); rect(width/2,height/2,50,50); …

---

## [P5.js issue - "bullet.push is not a function"](https://discourse.processing.org/t/p5-js-issue-bullet-push-is-not-a-function/9677)

<div class="topic-metadata">

**Author:** [@torridger](https://discourse.processing.org/u/torridger)\
**Replies:** 4\
**Last updated:** [March 28, 2019, 4:06am UTC](https://discourse.processing.org/t/p5-js-issue-bullet-push-is-not-a-function/9677 "2019-03-28T04:06:22Z")

</div>

Hi there, trying to follow this tutorial by TheCodingTrain on YouTube with some modification: I keep getting the error “bullet.push is not a function”. Any help is much appreciated. Please see my sketch.…

---

## [Loading a video stored locally on the PC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646)

<div class="topic-metadata">

**Author:** [@basicvisual](https://discourse.processing.org/u/basicvisual)\
**Replies:** 6\
**Last updated:** [March 27, 2019, 1:27pm UTC](https://discourse.processing.org/t/loading-a-video-stored-locally-on-the-pc/9646 "2019-03-27T13:27:47Z")

</div>

Hello , I am trying to load a video to the canvas which is stored locally . I went to the drop down menu and uploaded a small video , named test.mp4. I used the example code to run the video but i seem to get a blank s…

---

## [Multiple Key Inputs](https://discourse.processing.org/t/multiple-key-inputs/9662)

<div class="topic-metadata">

**Author:** [@Samira](https://discourse.processing.org/u/Samira)\
**Replies:** 3\
**Last updated:** [March 27, 2019, 12:10am UTC](https://discourse.processing.org/t/multiple-key-inputs/9662 "2019-03-27T00:10:22Z")

</div>

I’m trying to create a game where two people move at once. I’ve realised that you can’t have more than one key input at a time which makes my idea impossible. I was wondering if there was a way where I could have more th…

---

## [Troubles with variables](https://discourse.processing.org/t/troubles-with-variables/9383)

<div class="topic-metadata">

**Author:** [@Raidzor](https://discourse.processing.org/u/Raidzor)\
**Replies:** 2\
**Last updated:** [March 18, 2019, 3:26pm UTC](https://discourse.processing.org/t/troubles-with-variables/9383 "2019-03-18T15:26:23Z")

</div>

Being a beginner, I struggle to understand the structure you have to put variables in to actually make them work. Let’s suppose I have to create an object, an ellipse, that moves with constant speed, or even acceleration…

---

## [What means x\[\] = \[\] in p5.js](https://discourse.processing.org/t/what-means-x-in-p5-js/9287)

<div class="topic-metadata">

**Author:** [@vjjv](https://discourse.processing.org/u/vjjv)\
**Replies:** 1\
**Last updated:** [March 14, 2019, 1:54am UTC](https://discourse.processing.org/t/what-means-x-in-p5-js/9287 "2019-03-14T01:54:34Z")

</div>

hi! im trying to translate some code from p5.js var st = \[\]; function setup(){ for (var i=0; i\<maxW; i++) { st\[i\]=\[\]; // what means this? bright\[i\]=\[\]; } } what means ? st is a two dimensional array!

---

## [How to detect simultaneous keypress in p5.js](https://discourse.processing.org/t/how-to-detect-simultaneous-keypress-in-p5-js/9264)

<div class="topic-metadata">

**Author:** [@Jithin](https://discourse.processing.org/u/Jithin)\
**Replies:** 2\
**Last updated:** [March 13, 2019, 1:34pm UTC](https://discourse.processing.org/t/how-to-detect-simultaneous-keypress-in-p5-js/9264 "2019-03-13T13:34:54Z")

</div>

I’m trying to implement an undo functionality in a sketch. I need to detect simultaneous key press in p5. i.e ‘Ctrl’ and ‘z’ together? Is it possible?

---

## [mouseWheel and other callback functions not working in Instance Mode](https://discourse.processing.org/t/mousewheel-and-other-callback-functions-not-working-in-instance-mode/5436)

<div class="topic-metadata">

**Author:** [@FedFod](https://discourse.processing.org/u/FedFod)\
**Replies:** 9\
**Last updated:** [March 3, 2019, 11:55pm UTC](https://discourse.processing.org/t/mousewheel-and-other-callback-functions-not-working-in-instance-mode/5436 "2019-03-03T23:55:06Z")

</div>

After converting my code into instance mode, all the callback functions I had in place are not working anymore: for example mouseWheel, mousePressed, windowResized and so on. Should those functions reside inside the ins…

---

## [How do you use random without the numbers in between](https://discourse.processing.org/t/how-do-you-use-random-without-the-numbers-in-between/8144)

<div class="topic-metadata">

**Author:** [@Birnfeld](https://discourse.processing.org/u/Birnfeld)\
**Replies:** 3\
**Last updated:** [February 8, 2019, 5:06am UTC](https://discourse.processing.org/t/how-do-you-use-random-without-the-numbers-in-between/8144 "2019-02-08T05:06:06Z")

</div>

im doing a simple code and i want the variable to be -5 or +5 but i dont understand how you can do that without the numbers in between, for exemple sometimes i get -3,4,2,-1,2 ect…

---

## [Setting canvas and background color in setup() not working](https://discourse.processing.org/t/setting-canvas-and-background-color-in-setup-not-working/8162)

<div class="topic-metadata">

**Author:** [@Milky](https://discourse.processing.org/u/Milky)\
**Replies:** 2\
**Last updated:** [February 7, 2019, 4:48pm UTC](https://discourse.processing.org/t/setting-canvas-and-background-color-in-setup-not-working/8162 "2019-02-07T16:48:22Z")

</div>

function setup() { createCanvas(windowWidth, windowHeight); background(0, 0, 0); } this is pretty much how my setup() function starts. Everything in draw() works fine, but my canvas is never set and my background col…

---

## [How to add/push a new object to array upon mouse click in p5.js](https://discourse.processing.org/t/how-to-add-push-a-new-object-to-array-upon-mouse-click-in-p5-js/8043)

<div class="topic-metadata">

**Author:** [@blkpanther](https://discourse.processing.org/u/blkpanther)\
**Replies:** 5\
**Last updated:** [February 2, 2019, 6:29pm UTC](https://discourse.processing.org/t/how-to-add-push-a-new-object-to-array-upon-mouse-click-in-p5-js/8043 "2019-02-02T18:29:36Z")

</div>

I have this code to add a new ball to the array but strangely it doesn’t work. let balls = \[\]; let num\_balls = 1; let w = 800; let h = 600; function setup() { createCanvas(w, h); for (let i = 0; i \< num\_balls; …

---

## [Function keyPressed problems](https://discourse.processing.org/t/function-keypressed-problems/7924)

<div class="topic-metadata">

**Author:** [@hiitisme](https://discourse.processing.org/u/hiitisme)\
**Replies:** 1\
**Last updated:** [January 29, 2019, 9:19am UTC](https://discourse.processing.org/t/function-keypressed-problems/7924 "2019-01-29T09:19:29Z")

</div>

I am trying to make controls to my game. I am very new to javascript and other programming languages. I have made the controls, but they aren’t that smooth. when you take a sharp turn you just stop. Can someone help me m…

---

## [Getting a sketch to load between two images on a web page](https://discourse.processing.org/t/getting-a-sketch-to-load-between-two-images-on-a-web-page/7734)

<div class="topic-metadata">

**Author:** [@akathewb](https://discourse.processing.org/u/akathewb)\
**Replies:** 2\
**Last updated:** [January 23, 2019, 2:53am UTC](https://discourse.processing.org/t/getting-a-sketch-to-load-between-two-images-on-a-web-page/7734 "2019-01-23T02:53:40Z")

</div>

I’d like the script with the sketch.js to load between the two images, but it keeps loading at the end of the two images. Just learning HTML so any help would be great! Thanks! Web page: http://www.abunchoffailures.com…

---

## [Function KeyPressed](https://discourse.processing.org/t/function-keypressed/7676)

<div class="topic-metadata">

**Author:** [@Awazez](https://discourse.processing.org/u/Awazez)\
**Replies:** 4\
**Last updated:** [January 20, 2019, 2:40pm UTC](https://discourse.processing.org/t/function-keypressed/7676 "2019-01-20T14:40:54Z")

</div>

Hi ! I’m quite new in javascript and I tried to program a Flappy bird with the coding train video. I did a function named KeyPressed function KeyPressed () { if (key == "") { console.log("SPACE"); } } But it’…

---

## [Use an array of color \[RESOLVED\]](https://discourse.processing.org/t/use-an-array-of-color-resolved/6936)

<div class="topic-metadata">

**Author:** [@Pr0tonX](https://discourse.processing.org/u/Pr0tonX)\
**Replies:** 6\
**Last updated:** [December 28, 2018, 12:59am UTC](https://discourse.processing.org/t/use-an-array-of-color-resolved/6936 "2018-12-28T00:59:32Z")

</div>

Hi everyone, I have trouble with the use of an array of colors : once I setup it, I want to call randomly one of the colors inside. For now, I have that : var palette = \[\] function setup(){ palette\[0\] = color(154, 2…

---

## [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…

---

## [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

---

## [Fill() does not accept hexidecimal?](https://discourse.processing.org/t/fill-does-not-accept-hexidecimal/3920)

<div class="topic-metadata">

**Author:** [@HoboGreed](https://discourse.processing.org/u/HoboGreed)\
**Replies:** 3\
**Last updated:** [September 28, 2018, 9:56pm UTC](https://discourse.processing.org/t/fill-does-not-accept-hexidecimal/3920 "2018-09-28T21:56:27Z")

</div>

function setup() { createCanvas(500,700); background(0); } function draw() { //fill(0xffff0000); // no hexidecimal ? fill(255,255,0); ellipse(200,200,250); }

---

## [Text Not Displaying In Console](https://discourse.processing.org/t/text-not-displaying-in-console/3581)

<div class="topic-metadata">

**Author:** [@HoboGreed](https://discourse.processing.org/u/HoboGreed)\
**Replies:** 14\
**Last updated:** [September 27, 2018, 7:15pm UTC](https://discourse.processing.org/t/text-not-displaying-in-console/3581 "2018-09-27T19:15:14Z")

</div>

Hard to be a noob…why isn’t print displaying in the console? function setup() { createCanvas(500,500); print("ummmmmmm....."); } function draw() { }

---

## [Variable not found](https://discourse.processing.org/t/variable-not-found/3541)

<div class="topic-metadata">

**Author:** [@Blue\_Obsidian](https://discourse.processing.org/u/Blue_Obsidian)\
**Replies:** 5\
**Last updated:** [September 15, 2018, 10:25pm UTC](https://discourse.processing.org/t/variable-not-found/3541 "2018-09-15T22:25:30Z")

</div>

I have a problem with my code. At line 105, it doesn’t find p1 and I don’t know why, so can you help me please? Here’s the link: https://editor.p5js.org/Dark\_Obsidian/sketches/H1krCM\_\_Q

---

## [How to run p5 in ElectronJS](https://discourse.processing.org/t/how-to-run-p5-in-electronjs/3467)

<div class="topic-metadata">

**Author:** [@kokoo](https://discourse.processing.org/u/kokoo)\
**Replies:** 2\
**Last updated:** [September 15, 2018, 2:47pm UTC](https://discourse.processing.org/t/how-to-run-p5-in-electronjs/3467 "2018-09-15T14:47:19Z")

</div>

Is there any video tutorial how to setup and run p5 scripts in Electron framework?

---

## [How can I change the properties of a elements :focus in p5?](https://discourse.processing.org/t/how-can-i-change-the-properties-of-a-elements-focus-in-p5/3208)

<div class="topic-metadata">

**Author:** [@kiko](https://discourse.processing.org/u/kiko)\
**Replies:** 6\
**Last updated:** [September 3, 2018, 12:56am UTC](https://discourse.processing.org/t/how-can-i-change-the-properties-of-a-elements-focus-in-p5/3208 "2018-09-03T00:56:51Z")

</div>

So I have an input stored as a variable. let input = createInput(); Now, I want to remove the border that is created when you click on it. I know that can be done in css with input:focus{ outline:none; } So how…

---

## [Draw 1 frame only](https://discourse.processing.org/t/draw-1-frame-only/3206)

<div class="topic-metadata">

**Author:** [@dislo](https://discourse.processing.org/u/dislo)\
**Replies:** 3\
**Last updated:** [September 2, 2018, 9:05pm UTC](https://discourse.processing.org/t/draw-1-frame-only/3206 "2018-09-02T21:05:31Z")

</div>

i just want to draw one picture, no animation. is this possible?

---

## [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 …

[Previous page](https://discourse.processing.org/c/p5js/p5js-beginners/16.md?page=14)

[Next page](https://discourse.processing.org/c/p5js/p5js-beginners/16.md?page=16)
