# Beginners

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

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

**Page:** 7

---

## [What is wrong with this simple code](https://discourse.processing.org/t/what-is-wrong-with-this-simple-code/34289)

<div class="topic-metadata">

**Author:** [@parichko](https://discourse.processing.org/u/parichko)\
**Replies:** 4\
**Last updated:** [December 26, 2021, 5:55pm UTC](https://discourse.processing.org/t/what-is-wrong-with-this-simple-code/34289 "2021-12-26T17:55:37Z")

</div>

When the ball goes to the down right corner it freezes. I tried everything. What is wrong with that code. let x = 50 let y = 50 let s1 = 1 let s2 = 1 function setup() { createCanvas(400, 400); } function draw() { b…

---

## [What is the best way to make a if statement that activates when a shape hits the outer part of another shape or as some people may call it the outline](https://discourse.processing.org/t/what-is-the-best-way-to-make-a-if-statement-that-activates-when-a-shape-hits-the-outer-part-of-another-shape-or-as-some-people-may-call-it-the-outline/34287)

<div class="topic-metadata">

**Author:** [@parichko](https://discourse.processing.org/u/parichko)\
**Replies:** 2\
**Last updated:** [December 25, 2021, 1:16pm UTC](https://discourse.processing.org/t/what-is-the-best-way-to-make-a-if-statement-that-activates-when-a-shape-hits-the-outer-part-of-another-shape-or-as-some-people-may-call-it-the-outline/34287 "2021-12-25T13:16:46Z")

</div>

Lets say you are making a game where if a moving circle hits a rect it bounces off . Now the hard thing for me is to make the ball to do something if it hits the outline of the shape cause I need to make if x \> x-width/2…

---

## [Can you use eval() in p5js?](https://discourse.processing.org/t/can-you-use-eval-in-p5js/34183)

<div class="topic-metadata">

**Author:** [@MoonAlien822](https://discourse.processing.org/u/MoonAlien822)\
**Replies:** 9\
**Last updated:** [December 23, 2021, 8:24pm UTC](https://discourse.processing.org/t/can-you-use-eval-in-p5js/34183 "2021-12-23T20:24:05Z")

</div>

is the eval() function available for p5js?

---

## [Eval() not working](https://discourse.processing.org/t/eval-not-working/34248)

<div class="topic-metadata">

**Author:** [@MoonAlien822](https://discourse.processing.org/u/MoonAlien822)\
**Replies:** 1\
**Last updated:** [December 22, 2021, 3:46pm UTC](https://discourse.processing.org/t/eval-not-working/34248 "2021-12-22T15:46:51Z")

</div>

var x; var y; var z; var alpha; function setup() { createCanvas(600,600); x = "if(millis() % 1000 = 0){ eval(alpha);}"; y = "hello world"; z = "text(y, width/2, height/2);"; alpha = "background(rand…

---

## [Where is the \`whileLoadingCallback\` for images?](https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200)

<div class="topic-metadata">

**Author:** [@Errorbot1122](https://discourse.processing.org/u/Errorbot1122)\
**Replies:** 1\
**Last updated:** [December 20, 2021, 12:00am UTC](https://discourse.processing.org/t/where-is-the-whileloadingcallback-for-images/34200 "2021-12-20T00:00:04Z")

</div>

Where is the whileLoadingCallback for images? I know p5 has one for sound, but not images for some reason… Well, you know what, if you’re going to add on for images, what about adding them for tables or XML Files, etc.

---

## [How do you create an instance of an object and reference it eg. to rotate an object at a later time?](https://discourse.processing.org/t/how-do-you-create-an-instance-of-an-object-and-reference-it-eg-to-rotate-an-object-at-a-later-time/34067)

<div class="topic-metadata">

**Author:** [@jmg007](https://discourse.processing.org/u/jmg007)\
**Replies:** 5\
**Last updated:** [December 17, 2021, 12:27pm UTC](https://discourse.processing.org/t/how-do-you-create-an-instance-of-an-object-and-reference-it-eg-to-rotate-an-object-at-a-later-time/34067 "2021-12-17T12:27:11Z")

</div>

Hi, I’ve loaded in a 3d model and I looked at the p5 docs for rotating the model and one of the functions is: function draw() { background(200); rotateX(frameCount \* 0.01); rotateY(frameCount \* 0.01); model(oct…

---

## [\[p5.js\] Split operation does not work with text obtained by loadStrings](https://discourse.processing.org/t/p5-js-split-operation-does-not-work-with-text-obtained-by-loadstrings/34056)

<div class="topic-metadata">

**Author:** [@GWAK](https://discourse.processing.org/u/GWAK)\
**Replies:** 9\
**Last updated:** [December 13, 2021, 5:24am UTC](https://discourse.processing.org/t/p5-js-split-operation-does-not-work-with-text-obtained-by-loadstrings/34056 "2021-12-13T05:24:51Z")

</div>

\[P5.JS\] var value1; var value2; function setup() { createCanvas(450, 150); background(220); textSize(12); let url = " SITE IP ADDRESS /split\_test/user\_check.php?"; value1 = loadStrings(url)…

---

## [Arrow functions](https://discourse.processing.org/t/arrow-functions/33715)

<div class="topic-metadata">

**Author:** [@Clark](https://discourse.processing.org/u/Clark)\
**Replies:** 2\
**Last updated:** [November 29, 2021, 1:18am UTC](https://discourse.processing.org/t/arrow-functions/33715 "2021-11-29T01:18:09Z")

</div>

Hi. This code is from Roni Kaufman on OpenProcessing Could anyone please explain in a beginner-understandable way what the function below does and how it works? let noiseProg = (x) =\> (x); Whole code: // By Roni Kau…

---

## [When do you need "var"? Can you only use "let" to declare variables?](https://discourse.processing.org/t/when-do-you-need-var-can-you-only-use-let-to-declare-variables/19673)

<div class="topic-metadata">

**Author:** [@mnoble](https://discourse.processing.org/u/mnoble)\
**Replies:** 5\
**Last updated:** [November 25, 2021, 2:42am UTC](https://discourse.processing.org/t/when-do-you-need-var-can-you-only-use-let-to-declare-variables/19673 "2021-11-25T02:42:50Z")

</div>

Hello Forum, Can p5js variables be declared and used exclusively with “let” or are there instances when you need “var”? Thank you for your help let move = 150; let on = true; //or var move; var on;

---

## [Low frequency oscillator](https://discourse.processing.org/t/low-frequency-oscillator/33711)

<div class="topic-metadata">

**Author:** [@moutcast](https://discourse.processing.org/u/moutcast)\
**Replies:** 2\
**Last updated:** [November 24, 2021, 1:43pm UTC](https://discourse.processing.org/t/low-frequency-oscillator/33711 "2021-11-24T13:43:06Z")

</div>

hi, beginner here. how can i create a low frequency oscillator with adjustable frequency? i am trying soundloop but i cant figure out how to adjust the tempo from a function with a slider. other examples very welcome?…

---

## [Sharing just the sketch?](https://discourse.processing.org/t/sharing-just-the-sketch/33667)

<div class="topic-metadata">

**Author:** [@Timo](https://discourse.processing.org/u/Timo)\
**Replies:** 4\
**Last updated:** [November 23, 2021, 11:02am UTC](https://discourse.processing.org/t/sharing-just-the-sketch/33667 "2021-11-23T11:02:20Z")

</div>

Hi , this is a very basic question. I was using p5js web editor to experiment on my sketches . However there is a lot of code written on a trial or error basis . Is there a way to just share the sketch ? I think with the…

---

## [Uploading P5.js sketch from P3 IDE](https://discourse.processing.org/t/uploading-p5-js-sketch-from-p3-ide/27447)

<div class="topic-metadata">

**Author:** [@geo3geo](https://discourse.processing.org/u/geo3geo)\
**Replies:** 8\
**Last updated:** [November 22, 2021, 9:39am UTC](https://discourse.processing.org/t/uploading-p5-js-sketch-from-p3-ide/27447 "2021-11-22T09:39:38Z")

</div>

I’ve created a program using P3 IDE in P5.js mode. Runs well on my Chrome web server so now I want to share it on the P5js.org web site. I foolishly assumed I would be able to upload my project like I used to do with Ja…

---

## [How to use P5.js in H5p](https://discourse.processing.org/t/how-to-use-p5-js-in-h5p/33612)

<div class="topic-metadata">

**Author:** [@ViCh](https://discourse.processing.org/u/ViCh)\
**Replies:** 2\
**Last updated:** [November 20, 2021, 4:51am UTC](https://discourse.processing.org/t/how-to-use-p5-js-in-h5p/33612 "2021-11-20T04:51:50Z")

</div>

I am trying to create distributable packages(H5p) for the game that I have created using P5.js and Blockly. Basically in this game output is generated on-screen(P5.js, HTML Canvas) taking the instructions from the Blockl…

---

## [Save the canvas at a frequency keeping all the images](https://discourse.processing.org/t/save-the-canvas-at-a-frequency-keeping-all-the-images/33559)

<div class="topic-metadata">

**Author:** [@Hiram-Belgium](https://discourse.processing.org/u/Hiram-Belgium)\
**Replies:** 7\
**Last updated:** [November 17, 2021, 4:11pm UTC](https://discourse.processing.org/t/save-the-canvas-at-a-frequency-keeping-all-the-images/33559 "2021-11-17T16:11:07Z")

</div>

Hello, I am a beginner who knows very little about programming. I would like to know how to save the canvas at regular intervals, for example every 5 seconds … But also obviously keep all the images. Example image1-5sec…

---

## [Downloading images from server in the background, while script is running](https://discourse.processing.org/t/downloading-images-from-server-in-the-background-while-script-is-running/33556)

<div class="topic-metadata">

**Author:** [@user101](https://discourse.processing.org/u/user101)\
**Replies:** 1\
**Last updated:** [November 16, 2021, 8:15pm UTC](https://discourse.processing.org/t/downloading-images-from-server-in-the-background-while-script-is-running/33556 "2021-11-16T20:15:59Z")

</div>

I want to create a website with many, many images on the frontpage. However, not all of these images are visiable from the start of the script on, instead they should be downloaded from the server in the background, whil…

---

## [Difference between directionalLight() and pointLight() on basic 3D shapes and P5.Geometry shapes](https://discourse.processing.org/t/difference-between-directionallight-and-pointlight-on-basic-3d-shapes-and-p5-geometry-shapes/33419)

<div class="topic-metadata">

**Author:** [@J\_Silva](https://discourse.processing.org/u/J_Silva)\
**Replies:** 8\
**Last updated:** [November 15, 2021, 6:09am UTC](https://discourse.processing.org/t/difference-between-directionallight-and-pointlight-on-basic-3d-shapes-and-p5-geometry-shapes/33419 "2021-11-15T06:09:31Z")

</div>

Hi. When using directionalLight() I need to give a negative z value to actually see the light. If I understand it well the z value is positive towards the ‘viewer’, and that’s what happens when I use a positive z value…

---

## [Methods bound to p5 "canvas" vs. offscreen p5 "graphics"](https://discourse.processing.org/t/methods-bound-to-p5-canvas-vs-offscreen-p5-graphics/14079)

<div class="topic-metadata">

**Author:** [@grege2](https://discourse.processing.org/u/grege2)\
**Replies:** 5\
**Last updated:** [November 7, 2021, 4:23am UTC](https://discourse.processing.org/t/methods-bound-to-p5-canvas-vs-offscreen-p5-graphics/14079 "2021-11-07T04:23:30Z")

</div>

Hi folks, I’m finding that some everyday p5.js methods are not bound to a p5 canvas in the way that I expected. But they are all bound ok to a p5.Graphics created with createGraphics(). So, if I create a canvas, with …

---

## [Change button name programmatically](https://discourse.processing.org/t/change-button-name-programmatically/33257)

<div class="topic-metadata">

**Author:** [@Clark](https://discourse.processing.org/u/Clark)\
**Replies:** 2\
**Last updated:** [November 2, 2021, 5:04pm UTC](https://discourse.processing.org/t/change-button-name-programmatically/33257 "2021-11-02T17:04:08Z")

</div>

Hi. Is it possible to change the name of a button programmatically? Something like: button = createButton("one"); button.position(0, 0); button.mousePressed(changeName); function changeName() { button.value = "two"…

---

## [Color interpolation in HSB - how to go the "closest" direction?](https://discourse.processing.org/t/color-interpolation-in-hsb-how-to-go-the-closest-direction/33211)

<div class="topic-metadata">

**Author:** [@dtreybig](https://discourse.processing.org/u/dtreybig)\
**Replies:** 2\
**Last updated:** [November 1, 2021, 7:13am UTC](https://discourse.processing.org/t/color-interpolation-in-hsb-how-to-go-the-closest-direction/33211 "2021-11-01T07:13:48Z")

</div>

Hi! I am exploring doing some color gradients in something I am working on. I generally have the core structure working well, defining multiple colors and using lerpColor() to linearly interpolate between them. The chal…

---

## [General question on p5.js](https://discourse.processing.org/t/general-question-on-p5-js/33020)

<div class="topic-metadata">

**Author:** [@user101](https://discourse.processing.org/u/user101)\
**Replies:** 4\
**Last updated:** [October 23, 2021, 10:09pm UTC](https://discourse.processing.org/t/general-question-on-p5-js/33020 "2021-10-23T22:09:22Z")

</div>

Hi! I wanna create my one website and therefore want to learn programming with p5.js. I have e question, however. The p5.js library files have together have a size of eight MB. Does this mean, these 8 MB have to downloa…

---

## [Is there a way stop the function "windowResized" to rerun the "draw"?](https://discourse.processing.org/t/is-there-a-way-stop-the-function-windowresized-to-rerun-the-draw/32995)

<div class="topic-metadata">

**Author:** [@animanoir](https://discourse.processing.org/u/animanoir)\
**Replies:** 2\
**Last updated:** [October 22, 2021, 4:23pm UTC](https://discourse.processing.org/t/is-there-a-way-stop-the-function-windowresized-to-rerun-the-draw/32995 "2021-10-22T16:23:18Z")

</div>

Each time the windows is resized, the responsive function works as intended, but redrawing the canvas so all the sketch and its variables are recalculated. I simply want to position words in a random way through out the…

---

## [Orthographic camera not working](https://discourse.processing.org/t/orthographic-camera-not-working/32950)

<div class="topic-metadata">

**Author:** [@clankill3r](https://discourse.processing.org/u/clankill3r)\
**Replies:** 1\
**Last updated:** [October 20, 2021, 2:53pm UTC](https://discourse.processing.org/t/orthographic-camera-not-working/32950 "2021-10-20T14:53:00Z")

</div>

I’m wondering if the orthographic camera is broken. I used the settings found here: I just don’t see anything appearing. Could someone confirm?

---

## [Trying to get a better understanding of array loops](https://discourse.processing.org/t/trying-to-get-a-better-understanding-of-array-loops/32779)

<div class="topic-metadata">

**Author:** [@ADG](https://discourse.processing.org/u/ADG)\
**Replies:** 11\
**Last updated:** [October 19, 2021, 7:22pm UTC](https://discourse.processing.org/t/trying-to-get-a-better-understanding-of-array-loops/32779 "2021-10-19T19:22:37Z")

</div>

Hi, I’m trying to get a better understanding of arrays at a basic level before I advance to using them with functions & classes, but I am struggling a little. I wrote this: let r; let g; let b; let x; let y; let w; le…

---

## [Why default Black color in chrome](https://discourse.processing.org/t/why-default-black-color-in-chrome/32888)

<div class="topic-metadata">

**Author:** [@Cere1998](https://discourse.processing.org/u/Cere1998)\
**Replies:** 5\
**Last updated:** [October 18, 2021, 10:48am UTC](https://discourse.processing.org/t/why-default-black-color-in-chrome/32888 "2021-10-18T10:48:18Z")

</div>

New to p5.js how come my default color is black when i run it in chrome? using brackets function setup() { createCanvas(480,120); } function draw() { rect(180, 60, 220, 40); }

---

## [Full screen issue, white canvas - keyPressed](https://discourse.processing.org/t/full-screen-issue-white-canvas-keypressed/32795)

<div class="topic-metadata">

**Author:** [@u\_ro](https://discourse.processing.org/u/u_ro)\
**Replies:** 5\
**Last updated:** [October 15, 2021, 11:13am UTC](https://discourse.processing.org/t/full-screen-issue-white-canvas-keypressed/32795 "2021-10-15T11:13:39Z")

</div>

Hi guys, I am an absolutely newbie of p5js. I am having trouble when I play my sketch in full screen, I attach an example I set function setup() { createCanvas(windowWidth, windowHeight); background(0); and then …

---

## [Get pixels in instance mode](https://discourse.processing.org/t/get-pixels-in-instance-mode/32689)

<div class="topic-metadata">

**Author:** [@mark75](https://discourse.processing.org/u/mark75)\
**Replies:** 5\
**Last updated:** [October 8, 2021, 8:41pm UTC](https://discourse.processing.org/t/get-pixels-in-instance-mode/32689 "2021-10-08T20:41:03Z")

</div>

Hello there, I’m having an odd moment with trying to get pixels from an image in instance mode. I’m unable to reference the image as one would normally \>\>\> let pix = p.img.get(p.x, p.y); What am I doing wrong? Any poin…

---

## [Get random seed value in p5.js?](https://discourse.processing.org/t/get-random-seed-value-in-p5-js/32635)

<div class="topic-metadata">

**Author:** [@jeffthompson](https://discourse.processing.org/u/jeffthompson)\
**Replies:** 5\
**Last updated:** [October 6, 2021, 3:54pm UTC](https://discourse.processing.org/t/get-random-seed-value-in-p5-js/32635 "2021-10-06T15:54:56Z")

</div>

I’ve looked at the source code for the p5.js randomSeed() function but can’t quite figure this out: is it possible to get the seed value currently being used by the random() function? I’d like to grab this is setup() so …

---

## [Let/var behaviour inside function vs outside](https://discourse.processing.org/t/let-var-behaviour-inside-function-vs-outside/32639)

<div class="topic-metadata">

**Author:** [@ADG](https://discourse.processing.org/u/ADG)\
**Replies:** 3\
**Last updated:** [October 5, 2021, 6:03pm UTC](https://discourse.processing.org/t/let-var-behaviour-inside-function-vs-outside/32639 "2021-10-05T18:03:41Z")

</div>

Probably a dumb question, but in this example: var angle = 0.0; function setup() { createCanvas(120, 120); background(204); } function draw() { translate(mouseX, mouseY); rotate(angle); rect(-15, -15, 30, 30); angle += …

---

## [Hello,basic question, x is not a function](https://discourse.processing.org/t/hello-basic-question-x-is-not-a-function/32579)

<div class="topic-metadata">

**Author:** [@momo](https://discourse.processing.org/u/momo)\
**Replies:** 4\
**Last updated:** [October 4, 2021, 2:25pm UTC](https://discourse.processing.org/t/hello-basic-question-x-is-not-a-function/32579 "2021-10-04T14:25:47Z")

</div>

let img; let cnv; let points =\[\] let mult = 0.008 var vScale = 1; function preload(){ img = loadImage("assets/22.jpg"); } function setup() { cnv = createCanvas(img.width, img.height); //print img let newCanvasX…

---

## [Random Color Gen . Store , Use](https://discourse.processing.org/t/random-color-gen-store-use/32493)

<div class="topic-metadata">

**Author:** [@ADG](https://discourse.processing.org/u/ADG)\
**Replies:** 4\
**Last updated:** [September 29, 2021, 3:46pm UTC](https://discourse.processing.org/t/random-color-gen-store-use/32493 "2021-09-29T15:46:03Z")

</div>

Hi, Very new to programming, and its concepts so I’m trying to create a random color generator that I can call anytime to provide my r,g,b values. This is what I wrote: let x; let y; let col = { r: \[\], g: \[\], b: …

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

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