# Coding Questions

**URL:** https://discourse.processing.org/c/p5js/p5js-questions/18.md?page=22

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

**Page:** 23

---

## [Manually calculate additive blendmode with pixels\[\]](https://discourse.processing.org/t/manually-calculate-additive-blendmode-with-pixels/28031)

<div class="topic-metadata">

**Author:** [@lilzer7](https://discourse.processing.org/u/lilzer7)\
**Replies:** 1\
**Last updated:** [February 23, 2021, 8:34pm UTC](https://discourse.processing.org/t/manually-calculate-additive-blendmode-with-pixels/28031 "2021-02-23T20:34:09Z")

</div>

Hi, I’m currently coding a program in which I draw some random generated patterns like this : function setup() { colorMode(RGB, 255, 255, 255, 255); blendMode(ADD); } function draw() { for(var i = 0; i \< …

---

## [Cannot find 'length' of undefined](https://discourse.processing.org/t/cannot-find-length-of-undefined/28008)

<div class="topic-metadata">

**Author:** [@adworetzky](https://discourse.processing.org/u/adworetzky)\
**Replies:** 2\
**Last updated:** [February 23, 2021, 12:25am UTC](https://discourse.processing.org/t/cannot-find-length-of-undefined/28008 "2021-02-23T00:25:57Z")

</div>

I’m trying to get my noisy type generator to iterate over multiple letters. But I seem to be stuck at the 2dimesional array. It keeps throwing the error “Uncaught TypeError: Cannot read property ‘length’ of undefined (sk…

---

## [P5JS error showing up](https://discourse.processing.org/t/p5js-error-showing-up/27904)

<div class="topic-metadata">

**Author:** [@Ariadne](https://discourse.processing.org/u/Ariadne)\
**Replies:** 9\
**Last updated:** [February 22, 2021, 4:08am UTC](https://discourse.processing.org/t/p5js-error-showing-up/27904 "2021-02-22T04:08:10Z")

</div>

So, I am trying to recreate the game of life in p5js. And for some reason, the official p5js web editor raises some sort of error in my code, which I have inspected thoroughly: const segmentSize = 25; class Point { …

---

## [Trying to Understand a Shader](https://discourse.processing.org/t/trying-to-understand-a-shader/27965)

<div class="topic-metadata">

**Author:** [@BigBigRed](https://discourse.processing.org/u/BigBigRed)\
**Replies:** 2\
**Last updated:** [February 21, 2021, 7:57pm UTC](https://discourse.processing.org/t/trying-to-understand-a-shader/27965 "2021-02-21T19:57:08Z")

</div>

I am trying to understand a shader file. They file has its own function to generate/produce noise. They have a function call ‘col.r+=noise(uv.xyy\*(12. … continues’. I understand that ‘uv’ refers a texture with u bei…

---

## [loadJSON() function error message](https://discourse.processing.org/t/loadjson-function-error-message/27893)

<div class="topic-metadata">

**Author:** [@EunieceHarris](https://discourse.processing.org/u/EunieceHarris)\
**Replies:** 8\
**Last updated:** [February 19, 2021, 10:09am UTC](https://discourse.processing.org/t/loadjson-function-error-message/27893 "2021-02-19T10:09:00Z")

</div>

I’m a newbie to p5.js but I’ve been playing around with using API’s. Whenever I call an API using the function loadJSON(), no matter what I always get the same error message that reads: p5.js says: It looks like there w…

---

## [HELP! p5.js Rect - Rect Collions other!](https://discourse.processing.org/t/help-p5-js-rect-rect-collions-other/27771)

<div class="topic-metadata">

**Author:** [@Zwaan69](https://discourse.processing.org/u/Zwaan69)\
**Replies:** 1\
**Last updated:** [February 14, 2021, 3:01pm UTC](https://discourse.processing.org/t/help-p5-js-rect-rect-collions-other/27771 "2021-02-14T15:01:19Z")

</div>

Hi, I have 2 questions that I love to have for making my own fun games like the helicopter. see picture… Small rectangle to right bosting with large rectangle, but small rect does not stand through, how? stuck just …

---

## [How do you add text that wraps a circle?](https://discourse.processing.org/t/how-do-you-add-text-that-wraps-a-circle/27789)

<div class="topic-metadata">

**Author:** [@Potato3218](https://discourse.processing.org/u/Potato3218)\
**Replies:** 4\
**Last updated:** [February 14, 2021, 2:04pm UTC](https://discourse.processing.org/t/how-do-you-add-text-that-wraps-a-circle/27789 "2021-02-14T14:04:50Z")

</div>

I have made a code something like this: createCanvas(800, 800); } function draw() { background("lightblue"); noStroke(); fill("green") ellipse(width/2,height/2,0.8\*width); fill("white") ellipse(width/2,he…

---

## [How to draw on a video](https://discourse.processing.org/t/how-to-draw-on-a-video/27642)

<div class="topic-metadata">

**Author:** [@skypickle](https://discourse.processing.org/u/skypickle)\
**Replies:** 8\
**Last updated:** [February 12, 2021, 1:02pm UTC](https://discourse.processing.org/t/how-to-draw-on-a-video/27642 "2021-02-12T13:02:46Z")

</div>

This sketch below puts up a video on the upper part of a light blue canvas. When the mouse is pressed, I can draw a line on the canvas but wherevere there is video, the line is not persistent. let capture; function set…

---

## [mousePressed() callback function inside object](https://discourse.processing.org/t/mousepressed-callback-function-inside-object/27753)

<div class="topic-metadata">

**Author:** [@jasonhallen](https://discourse.processing.org/u/jasonhallen)\
**Replies:** 4\
**Last updated:** [February 12, 2021, 3:44am UTC](https://discourse.processing.org/t/mousepressed-callback-function-inside-object/27753 "2021-02-12T03:44:32Z")

</div>

Hi everyone, I started learning p5.js a couple weeks ago and have been working on my first big project. I’m having a hard time troubleshooting an issue involving mousePressed() used inside of an object. Here’s a simpl…

---

## [Is there an easy way to bold individual words while using text()?](https://discourse.processing.org/t/is-there-an-easy-way-to-bold-individual-words-while-using-text/27645)

<div class="topic-metadata">

**Author:** [@Bassam](https://discourse.processing.org/u/Bassam)\
**Replies:** 7\
**Last updated:** [February 8, 2021, 2:58am UTC](https://discourse.processing.org/t/is-there-an-easy-way-to-bold-individual-words-while-using-text/27645 "2021-02-08T02:58:41Z")

</div>

I want to print My name is Bassam. on the canvas. This is the code I had to write: function setup() { const x = 50, y = 100; let xpos; createCanvas(400, 400); background("white"); textSize(28); tex…

---

## [Oblique text using CSS directly in P5](https://discourse.processing.org/t/oblique-text-using-css-directly-in-p5/27458)

<div class="topic-metadata">

**Author:** [@holytypo](https://discourse.processing.org/u/holytypo)\
**Replies:** 2\
**Last updated:** [February 8, 2021, 12:08am UTC](https://discourse.processing.org/t/oblique-text-using-css-directly-in-p5/27458 "2021-02-08T00:08:31Z")

</div>

Hey guys, I want to change the font weight and oblique angle directly in p5. I’ve managed to change the weight this way: p.style('font-weight', map(mouseX, 0, width, 1, 999)) but cannot find a way to change the slant…

---

## [P5.js Createfileinput custom text](https://discourse.processing.org/t/p5-js-createfileinput-custom-text/27602)

<div class="topic-metadata">

**Author:** [@nxmusic](https://discourse.processing.org/u/nxmusic)\
**Replies:** 1\
**Last updated:** [February 5, 2021, 6:27pm UTC](https://discourse.processing.org/t/p5-js-createfileinput-custom-text/27602 "2021-02-05T18:27:48Z")

</div>

When I create a input = createFileInput(handleFile); appears the text ‘seleccionar archivo’ and the name of file near. I can change this messages with .style or .attribute? Thanks

---

## [Problem with HSB](https://discourse.processing.org/t/problem-with-hsb/27510)

<div class="topic-metadata">

**Author:** [@clankill3r](https://discourse.processing.org/u/clankill3r)\
**Replies:** 2\
**Last updated:** [February 3, 2021, 1:47pm UTC](https://discourse.processing.org/t/problem-with-hsb/27510 "2021-02-03T13:47:29Z")

</div>

If I get the average color using RGB I get this, which looks correct: But when I try it with HSB, no matter what I try, I can’t get it right. I have been playing with colorMode(HSB, x, x, x), but I still end up with …

---

## [How to use an url to stream video](https://discourse.processing.org/t/how-to-use-an-url-to-stream-video/27539)

<div class="topic-metadata">

**Author:** [@ctremblay](https://discourse.processing.org/u/ctremblay)\
**Replies:** 0\
**Last updated:** [February 1, 2021, 11:00pm UTC](https://discourse.processing.org/t/how-to-use-an-url-to-stream-video/27539 "2021-02-01T23:00:26Z")

</div>

I’m trying to make my own movie app but when i try to load the movies onto p5.js it says too big. so I was wondering if there a way I can just grab the url no matter how long the video is and use it instead of loading ea…

---

## [Fragment shader too many uniforms error](https://discourse.processing.org/t/fragment-shader-too-many-uniforms-error/17603)

<div class="topic-metadata">

**Author:** [@GreenCell](https://discourse.processing.org/u/GreenCell)\
**Replies:** 14\
**Last updated:** [February 1, 2021, 8:11pm UTC](https://discourse.processing.org/t/fragment-shader-too-many-uniforms-error/17603 "2021-02-01T20:11:04Z")

</div>

Hi there! I’m trying to get into the world of fragment shaders but ran into an issue that only appears on some devices. I’m driving the shader with particles that I’m calculating in the sketch, then passing a list of th…

---

## [How do I merge shapes that have a stroke?](https://discourse.processing.org/t/how-do-i-merge-shapes-that-have-a-stroke/27493)

<div class="topic-metadata">

**Author:** [@thesuperdaine](https://discourse.processing.org/u/thesuperdaine)\
**Replies:** 6\
**Last updated:** [January 31, 2021, 9:13pm UTC](https://discourse.processing.org/t/how-do-i-merge-shapes-that-have-a-stroke/27493 "2021-01-31T21:13:18Z")

</div>

I need this ear to be flush with the head. I want to merge it with the head like how you can merge shapes in Inkscape or Illustrator. I can’t do this by just making everything one shape using vertices and beginShape() an…

---

## [How do I pass a function by reference and then call it?](https://discourse.processing.org/t/how-do-i-pass-a-function-by-reference-and-then-call-it/27474)

<div class="topic-metadata">

**Author:** [@thesuperdaine](https://discourse.processing.org/u/thesuperdaine)\
**Replies:** 7\
**Last updated:** [January 30, 2021, 10:46pm UTC](https://discourse.processing.org/t/how-do-i-pass-a-function-by-reference-and-then-call-it/27474 "2021-01-30T22:46:41Z")

</div>

I’m making a character animation engine and I want to make this animation class that lets me specify a function to call and 2 sets of arguments and then it uses lerp() to transition overtime using setInterval() between t…

---

## [From Javascript P5 to Processing 3.x](https://discourse.processing.org/t/from-javascript-p5-to-processing-3-x/27399)

<div class="topic-metadata">

**Author:** [@HerClau](https://discourse.processing.org/u/HerClau)\
**Replies:** 9\
**Last updated:** [January 28, 2021, 7:24am UTC](https://discourse.processing.org/t/from-javascript-p5-to-processing-3-x/27399 "2021-01-28T07:24:17Z")

</div>

good morning How to translate the following line of code to Preocessing: // array containing the x positions of the line graph, scaled to fit the canvas posx = Float32Array.from({ length: time }, (\_, i) =\> map(i, 0, …

---

## [Masking a createGraphics object generates lag](https://discourse.processing.org/t/masking-a-creategraphics-object-generates-lag/27395)

<div class="topic-metadata">

**Author:** [@thesuperdaine](https://discourse.processing.org/u/thesuperdaine)\
**Replies:** 3\
**Last updated:** [January 27, 2021, 9:12pm UTC](https://discourse.processing.org/t/masking-a-creategraphics-object-generates-lag/27395 "2021-01-27T21:12:43Z")

</div>

So I’m creating this animated character who needs to have their pupils stay inside the whites of their eyes. Since you can’t use mask() on a graphics object, I have to convert the pupils to an image using createImage and…

---

## [Create sliding loop](https://discourse.processing.org/t/create-sliding-loop/27409)

<div class="topic-metadata">

**Author:** [@codeflow](https://discourse.processing.org/u/codeflow)\
**Replies:** 4\
**Last updated:** [January 27, 2021, 5:14pm UTC](https://discourse.processing.org/t/create-sliding-loop/27409 "2021-01-27T17:14:55Z")

</div>

Hey everyone, my problem is that I cannot figure out how to loop text. In other words: If the text string leaves the canvas to the left side I want it to enter the canvas on the right side. My approach is to set the …

---

## [Mouse/key pressed question](https://discourse.processing.org/t/mouse-key-pressed-question/27417)

<div class="topic-metadata">

**Author:** [@QueensGambit](https://discourse.processing.org/u/QueensGambit)\
**Replies:** 1\
**Last updated:** [January 27, 2021, 6:48pm UTC](https://discourse.processing.org/t/mouse-key-pressed-question/27417 "2021-01-27T18:48:39Z")

</div>

please format code with \</\> button \* homework policy \* asking questions Hi!! I need some help with a project. I need to put in images and when I push for example number 1 a certain image pops up and when I push numb…

---

## [Slider.style() - change color of slider](https://discourse.processing.org/t/slider-style-change-color-of-slider/4329)

<div class="topic-metadata">

**Author:** [@slow\_izzm](https://discourse.processing.org/u/slow_izzm)\
**Replies:** 3\
**Last updated:** [January 27, 2021, 1:42pm UTC](https://discourse.processing.org/t/slider-style-change-color-of-slider/4329 "2021-01-27T13:42:23Z")

</div>

How do you change the color of a slider? It seems most other style properties work properly when using slider.style();, but neither background or background-color seem to make any change. I also tried to set the color in…

---

## [How to make a moving graph in Javascript P5](https://discourse.processing.org/t/how-to-make-a-moving-graph-in-javascript-p5/19630)

<div class="topic-metadata">

**Author:** [@mohashah](https://discourse.processing.org/u/mohashah)\
**Replies:** 3\
**Last updated:** [January 27, 2021, 12:50pm UTC](https://discourse.processing.org/t/how-to-make-a-moving-graph-in-javascript-p5/19630 "2021-01-27T12:50:43Z")

</div>

I have struggled to make my a moving graph in P5. My idea is to make a graph by the length of an array. If the length of the array increases the graph will move up and if it increases it will do the opposite. My code ca…

---

## [Convert processing to p5js code](https://discourse.processing.org/t/convert-processing-to-p5js-code/27405)

<div class="topic-metadata">

**Author:** [@l3ehfar](https://discourse.processing.org/u/l3ehfar)\
**Replies:** 1\
**Last updated:** [January 27, 2021, 10:16am UTC](https://discourse.processing.org/t/convert-processing-to-p5js-code/27405 "2021-01-27T10:16:46Z")

</div>

I need some help converting this Processing sketch to P5js sketch. I would be glad if someone helped me. float unit, theta; int num = 25, frames=180; void setup() { size(500, 500); unit = width/num; } void draw() …

---

## [Loop through a sequence](https://discourse.processing.org/t/loop-through-a-sequence/26242)

<div class="topic-metadata">

**Author:** [@Chigoz](https://discourse.processing.org/u/Chigoz)\
**Replies:** 12\
**Last updated:** [January 26, 2021, 10:23pm UTC](https://discourse.processing.org/t/loop-through-a-sequence/26242 "2021-01-26T22:23:59Z")

</div>

How do I loop through this sequence separated by commas so I can determine the minimum value? x = (min(splitFloat\[0\],splitFloat\[2\],splitFloat\[4\]); Thank you.

---

## [Is this really the best anti aliasing that p5 can do?](https://discourse.processing.org/t/is-this-really-the-best-anti-aliasing-that-p5-can-do/26525)

<div class="topic-metadata">

**Author:** [@thesuperdaine](https://discourse.processing.org/u/thesuperdaine)\
**Replies:** 18\
**Last updated:** [January 26, 2021, 10:02pm UTC](https://discourse.processing.org/t/is-this-really-the-best-anti-aliasing-that-p5-can-do/26525 "2021-01-26T22:02:56Z")

</div>

I’m working on a game with animated characters and I’ve noticed that while I can tell that anti aliasing is happening, it doesn’t look very pretty. Idk how to describe it well, but you can look at the picture. It just do…

---

## [Translating Processing to P5js](https://discourse.processing.org/t/translating-processing-to-p5js/27332)

<div class="topic-metadata">

**Author:** [@codeflow](https://discourse.processing.org/u/codeflow)\
**Replies:** 6\
**Last updated:** [January 25, 2021, 9:50am UTC](https://discourse.processing.org/t/translating-processing-to-p5js/27332 "2021-01-25T09:50:33Z")

</div>

Hey guys, this problem is driving me crazy, so I hope somebody can help. I have this code written in processing, that I want to implement into my html website. I was doing research and realized I need to convert it in…

---

## [How to apply easing to p5js sketch](https://discourse.processing.org/t/how-to-apply-easing-to-p5js-sketch/27322)

<div class="topic-metadata">

**Author:** [@StudioBoe](https://discourse.processing.org/u/StudioBoe)\
**Replies:** 2\
**Last updated:** [January 24, 2021, 11:12pm UTC](https://discourse.processing.org/t/how-to-apply-easing-to-p5js-sketch/27322 "2021-01-24T23:12:03Z")

</div>

Complete beginner here so apologies for what is probably an obvious solution — I’m using the atan2 function in p5.js to create a simple sketch where an arrow (imported svg) is following the cursor. How would one add eas…

---

## [P5.js Array: Multiple Objects getting Spliced instead of Single](https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317)

<div class="topic-metadata">

**Author:** [@devalladares](https://discourse.processing.org/u/devalladares)\
**Replies:** 1\
**Last updated:** [January 23, 2021, 11:32pm UTC](https://discourse.processing.org/t/p5-js-array-multiple-objects-getting-spliced-instead-of-single/27317 "2021-01-23T23:32:11Z")

</div>

I’m trying to create a moving array of decorative circles, and as soon as a circle moves off the edge of the screen I would like to remove it from the array. I have tried both splicing and filtering from the array – howe…

---

## [Student can't see running code](https://discourse.processing.org/t/student-cant-see-running-code/27249)

<div class="topic-metadata">

**Author:** [@MrRuTech](https://discourse.processing.org/u/MrRuTech)\
**Replies:** 5\
**Last updated:** [January 21, 2021, 8:11pm UTC](https://discourse.processing.org/t/student-cant-see-running-code/27249 "2021-01-21T20:11:39Z")

</div>

Student using p5.js on laptop creates code, runs code but can’t see program running. Student sends me the link to their sketch and I can run and see the code. We have tried this on several devices and browsers but it sti…

[Previous page](https://discourse.processing.org/c/p5js/p5js-questions/18.md?page=21)

[Next page](https://discourse.processing.org/c/p5js/p5js-questions/18.md?page=23)