# Coding Questions

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

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

**Page:** 28

---

## [The stroke color is mixed with the fill color](https://discourse.processing.org/t/the-stroke-color-is-mixed-with-the-fill-color/24058)

<div class="topic-metadata">

**Author:** [@san1](https://discourse.processing.org/u/san1)\
**Replies:** 1\
**Last updated:** [September 22, 2020, 8:29pm UTC](https://discourse.processing.org/t/the-stroke-color-is-mixed-with-the-fill-color/24058 "2020-09-22T20:29:10Z")

</div>

I drew black as the stroke color and set 1 as the weight, but the stroke color is not black. Please refer to the picture and code below. var canvasWidth = 640; var canvasHeight = 360; var blockSize = 30; function se…

---

## [Timers Not Frame Rate Dependent & Starting On Demand - Oh Please Oh Please :)](https://discourse.processing.org/t/timers-not-frame-rate-dependent-starting-on-demand-oh-please-oh-please/23994)

<div class="topic-metadata">

**Author:** [@mnoble](https://discourse.processing.org/u/mnoble)\
**Replies:** 11\
**Last updated:** [September 21, 2020, 11:44pm UTC](https://discourse.processing.org/t/timers-not-frame-rate-dependent-starting-on-demand-oh-please-oh-please/23994 "2020-09-21T23:44:06Z")

</div>

Hello Forum, I am making interactive visualizers that coordinate with sequenced visual automations and sound. I need to start a timer after a button is pushed (which I am pretty sure you can’t do with millis()) and I c…

---

## [About the draw function](https://discourse.processing.org/t/about-the-draw-function/23974)

<div class="topic-metadata">

**Author:** [@Willian\_Xz](https://discourse.processing.org/u/Willian_Xz)\
**Replies:** 11\
**Last updated:** [September 21, 2020, 1:05pm UTC](https://discourse.processing.org/t/about-the-draw-function/23974 "2020-09-21T13:05:39Z")

</div>

Hello people!! I built a code on a lamp that goes on and off, the idea was to talk about the frequency in Hertz that a common lamp goes on and off, so I created a “simulation” of it. The draw function as far as I know …

---

## [Implementing WEBGL 3D with graphics objects](https://discourse.processing.org/t/implementing-webgl-3d-with-graphics-objects/23989)

<div class="topic-metadata">

**Author:** [@AlteredPhoenix](https://discourse.processing.org/u/AlteredPhoenix)\
**Replies:** 8\
**Last updated:** [September 21, 2020, 9:23am UTC](https://discourse.processing.org/t/implementing-webgl-3d-with-graphics-objects/23989 "2020-09-21T09:23:47Z")

</div>

Hello, I’m currently working on adding 3D functionality to a music visualizer program. Initially I planned to just add the WEBGL argument to the existing createCanvas(), but it caused formatting problems, so I switched t…

---

## [Class and arguments : can't make fish turn around](https://discourse.processing.org/t/class-and-arguments-cant-make-fish-turn-around/23937)

<div class="topic-metadata">

**Author:** [@vlafortune](https://discourse.processing.org/u/vlafortune)\
**Replies:** 11\
**Last updated:** [September 20, 2020, 11:16pm UTC](https://discourse.processing.org/t/class-and-arguments-cant-make-fish-turn-around/23937 "2020-09-20T23:16:59Z")

</div>

Hi! With p5.js, I made three fishes that move and have different colors and speed with arguments in a class. But when I tried to add conditional statements to turn around when reaching the border, it didn’t work and I c…

---

## [Spherical Billboards](https://discourse.processing.org/t/spherical-billboards/23977)

<div class="topic-metadata">

**Author:** [@zackatoo](https://discourse.processing.org/u/zackatoo)\
**Replies:** 1\
**Last updated:** [September 20, 2020, 10:01am UTC](https://discourse.processing.org/t/spherical-billboards/23977 "2020-09-20T10:01:16Z")

</div>

I am trying to create a spherical billboard in the WEBGL version of p5.js. A spherical billboard is a 2D drawing which always faces the camera. I managed to create a cylindrical billboard (faces the camera, but only rota…

---

## [Text separation help](https://discourse.processing.org/t/text-separation-help/23859)

<div class="topic-metadata">

**Author:** [@DariusKempton](https://discourse.processing.org/u/DariusKempton)\
**Replies:** 8\
**Last updated:** [September 19, 2020, 7:45pm UTC](https://discourse.processing.org/t/text-separation-help/23859 "2020-09-19T19:45:15Z")

</div>

I am trying to create a Text Adventure game, but i am having problems trying to have both the title for the game and the game text display at the same time. Is there a way to create different text, so that i can have Sto…

---

## [P5 transparent image problem](https://discourse.processing.org/t/p5-transparent-image-problem/23891)

<div class="topic-metadata">

**Author:** [@yhlaskerimov](https://discourse.processing.org/u/yhlaskerimov)\
**Replies:** 5\
**Last updated:** [September 18, 2020, 8:06pm UTC](https://discourse.processing.org/t/p5-transparent-image-problem/23891 "2020-09-18T20:06:05Z")

</div>

Hi, everyone. I have problem. My problem is: I want to load an transparent image to my p5 sketch. I used texture and rect to do that. But I couldn’t get right effect. I wanted to get this effect: I get this one(no…

---

## [How to rewrite function without instancing random()](https://discourse.processing.org/t/how-to-rewrite-function-without-instancing-random/23840)

<div class="topic-metadata">

**Author:** [@bakursky](https://discourse.processing.org/u/bakursky)\
**Replies:** 3\
**Last updated:** [September 18, 2020, 9:49am UTC](https://discourse.processing.org/t/how-to-rewrite-function-without-instancing-random/23840 "2020-09-18T09:49:43Z")

</div>

I have the eye() function and I want to duplicate it several times that every eye look in a different direction (now random number copy to all function instances) let x=0; let y=0; function setup() { createCanvas…

---

## [Wanting to load images/sprites onto tiles from a txt file 0=grass, 1=track, 2=start finish](https://discourse.processing.org/t/wanting-to-load-images-sprites-onto-tiles-from-a-txt-file-0-grass-1-track-2-start-finish/23909)

<div class="topic-metadata">

**Author:** [@ChipperActual](https://discourse.processing.org/u/ChipperActual)\
**Replies:** 0\
**Last updated:** [September 17, 2020, 1:22am UTC](https://discourse.processing.org/t/wanting-to-load-images-sprites-onto-tiles-from-a-txt-file-0-grass-1-track-2-start-finish/23909 "2020-09-17T01:22:16Z")

</div>

Hey All I am wanting to load images/sprites onto tiles from a txt file 0=grass, 1=track, 2=start finish, i have managed to read from the text file (shown in preview) Stuck on how to draw the tiles/images/sprites to the…

---

## [Need help with the keyPressed () function](https://discourse.processing.org/t/need-help-with-the-keypressed-function/23863)

<div class="topic-metadata">

**Author:** [@The\_Rogue12](https://discourse.processing.org/u/The_Rogue12)\
**Replies:** 4\
**Last updated:** [September 15, 2020, 6:22pm UTC](https://discourse.processing.org/t/need-help-with-the-keypressed-function/23863 "2020-09-15T18:22:05Z")

</div>

So I am trying to write code that changes a variable when I press a certain key. The problem is, the keyPressed() function isn’t detecting any key presses. What am I doing wrong? My code: var x, y; var shape; function …

---

## [High resolution print using p5 vs. Processing](https://discourse.processing.org/t/high-resolution-print-using-p5-vs-processing/23782)

<div class="topic-metadata">

**Author:** [@gjs](https://discourse.processing.org/u/gjs)\
**Replies:** 2\
**Last updated:** [September 15, 2020, 12:45am UTC](https://discourse.processing.org/t/high-resolution-print-using-p5-vs-processing/23782 "2020-09-15T00:45:25Z")

</div>

Casey Reas wrote a wonderful tutorial on printing \[https://processing.org/tutorials/print/\] that detailed instructions on how to export high-resolution files in Processing. I would like to do the same with my p5-generat…

---

## [Variable Fonts on p5.js](https://discourse.processing.org/t/variable-fonts-on-p5-js/19775)

<div class="topic-metadata">

**Author:** [@DaniT3K](https://discourse.processing.org/u/DaniT3K)\
**Replies:** 3\
**Last updated:** [September 14, 2020, 4:51pm UTC](https://discourse.processing.org/t/variable-fonts-on-p5-js/19775 "2020-09-14T16:51:15Z")

</div>

Hello guys, I’m Daniel a graphic designer from Portugal ending my master degree! For my thesis im working with variable fonts. Does anyone knows or have a sketch on how to implement variable fonts on p5.js? Im strugglin…

---

## [How to make a start game screen?](https://discourse.processing.org/t/how-to-make-a-start-game-screen/23776)

<div class="topic-metadata">

**Author:** [@spacecad3t](https://discourse.processing.org/u/spacecad3t)\
**Replies:** 7\
**Last updated:** [September 12, 2020, 11:03pm UTC](https://discourse.processing.org/t/how-to-make-a-start-game-screen/23776 "2020-09-12T23:03:33Z")

</div>

Hi, I was wondering if someone could point me in the right direction. I’m making an interactive snake game and I’d like to have a ‘click to start’ screen at the beginning. This is my sketch.js: var screen = 0; var x; v…

---

## [Smooth() repositioning p5.js sketch unexpectedly](https://discourse.processing.org/t/smooth-repositioning-p5-js-sketch-unexpectedly/23675)

<div class="topic-metadata">

**Author:** [@jimy102](https://discourse.processing.org/u/jimy102)\
**Replies:** 2\
**Last updated:** [September 5, 2020, 1:38am UTC](https://discourse.processing.org/t/smooth-repositioning-p5-js-sketch-unexpectedly/23675 "2020-09-05T01:38:00Z")

</div>

So I’ve been trying to get a bit of an animation going, and it’s basically finished, except for antialiasing. The problem is whenever I try to use smooth(); my entire sketch gets positioned lower on the index.html. I t…

---

## [P5 instance mode with image and sliders](https://discourse.processing.org/t/p5-instance-mode-with-image-and-sliders/23654)

<div class="topic-metadata">

**Author:** [@nikodemd](https://discourse.processing.org/u/nikodemd)\
**Replies:** 1\
**Last updated:** [September 3, 2020, 4:48pm UTC](https://discourse.processing.org/t/p5-instance-mode-with-image-and-sliders/23654 "2020-09-03T16:48:01Z")

</div>

Hi guys! I am trying to convert my p5 code into instance mode, but it does not seem to work. Does anybody have an idea what am I doing wrong? here is the code: let sketch = function(p) { let DAYLIGHT; let canva…

---

## [Creating game dialogue](https://discourse.processing.org/t/creating-game-dialogue/23594)

<div class="topic-metadata">

**Author:** [@fucfucbrain](https://discourse.processing.org/u/fucfucbrain)\
**Replies:** 4\
**Last updated:** [September 1, 2020, 10:08pm UTC](https://discourse.processing.org/t/creating-game-dialogue/23594 "2020-09-01T22:08:49Z")

</div>

Hi I am in the process of developing my first game. It is an adventure platformer comprised of various missions that lead you to the overall objective (growing a flower). I am currently trying to develop a system to imp…

---

## [Is it possible to show p5js program in Google Sites web site?](https://discourse.processing.org/t/is-it-possible-to-show-p5js-program-in-google-sites-web-site/23620)

<div class="topic-metadata">

**Author:** [@kkchau](https://discourse.processing.org/u/kkchau)\
**Replies:** 6\
**Last updated:** [September 2, 2020, 3:23pm UTC](https://discourse.processing.org/t/is-it-possible-to-show-p5js-program-in-google-sites-web-site/23620 "2020-09-02T15:23:13Z")

</div>

please format code with \</\> button \* homework policy \* asking questions I have a web page that is build by google sites, and i want to show some p5js program graphic in it. i have seen people discuss to use iframe t…

---

## [How to create smooth animation for my sketch](https://discourse.processing.org/t/how-to-create-smooth-animation-for-my-sketch/23565)

<div class="topic-metadata">

**Author:** [@bakursky](https://discourse.processing.org/u/bakursky)\
**Replies:** 4\
**Last updated:** [September 2, 2020, 8:53am UTC](https://discourse.processing.org/t/how-to-create-smooth-animation-for-my-sketch/23565 "2020-09-02T08:53:56Z")

</div>

Hey! I have a simple circle array program. var particles = \[\]; function setup() { createCanvas(400, 400); } function draw() { background(220); angleMode(DEGREES); translate(200,200); for (var i = …

---

## [Using pixels array to fill shape](https://discourse.processing.org/t/using-pixels-array-to-fill-shape/23526)

<div class="topic-metadata">

**Author:** [@andypurbrick](https://discourse.processing.org/u/andypurbrick)\
**Replies:** 5\
**Last updated:** [September 1, 2020, 3:33pm UTC](https://discourse.processing.org/t/using-pixels-array-to-fill-shape/23526 "2020-09-01T15:33:49Z")

</div>

Hi, I’m pretty new to p5 and have never used the pixels array before. I’ve read the documentation and watched some videos on the pixels array but I can’t work out how to achieve the specific effect I’m looking for. I wa…

---

## [Text Randomizer](https://discourse.processing.org/t/text-randomizer/23509)

<div class="topic-metadata">

**Author:** [@Rohitsharma](https://discourse.processing.org/u/Rohitsharma)\
**Replies:** 29\
**Last updated:** [August 31, 2020, 8:28pm UTC](https://discourse.processing.org/t/text-randomizer/23509 "2020-08-31T20:28:00Z")

</div>

Hello, I am trying to write a text randomizer. The idea is to put individual letters of ‘ATOMS’ into the grid. There is a specific grid that I have created and I want Individual letters of the word ‘ATOMS’ to sit in ran…

---

## [Loading files (e.g., loadBytes) in p5.js using node.js](https://discourse.processing.org/t/loading-files-e-g-loadbytes-in-p5-js-using-node-js/23560)

<div class="topic-metadata">

**Author:** [@JBall](https://discourse.processing.org/u/JBall)\
**Replies:** 1\
**Last updated:** [August 31, 2020, 5:11pm UTC](https://discourse.processing.org/t/loading-files-e-g-loadbytes-in-p5-js-using-node-js/23560 "2020-08-31T17:11:20Z")

</div>

Hello all, I am working on a basic project where I want to have a webpage available to my group members where they can go to see the current status of some data files that are populated by a separate program and copied …

---

## [How to hide and show player in board?](https://discourse.processing.org/t/how-to-hide-and-show-player-in-board/23582)

<div class="topic-metadata">

**Author:** [@Xremix31](https://discourse.processing.org/u/Xremix31)\
**Replies:** 1\
**Last updated:** [August 31, 2020, 1:01pm UTC](https://discourse.processing.org/t/how-to-hide-and-show-player-in-board/23582 "2020-08-31T13:01:07Z")

</div>

Hi, I have a problems in my game like monopoly. I created the board and the players inside the setup and did the sprite in the draw. The problem is that every time I launch the data, the player is visible in the positi…

---

## [screenPositionFunction not projecting correctly](https://discourse.processing.org/t/screenpositionfunction-not-projecting-correctly/23019)

<div class="topic-metadata">

**Author:** [@CND](https://discourse.processing.org/u/CND)\
**Replies:** 11\
**Last updated:** [August 29, 2020, 8:04pm UTC](https://discourse.processing.org/t/screenpositionfunction-not-projecting-correctly/23019 "2020-08-29T20:04:41Z")

</div>

This is my test of the screenPosition function that is not working correctly for me. I have digitized the 6 faces for a basic block and tried drawing them with world coordinates and then screen coordinates. The screen dr…

---

## [Why does windowWidth not trigger?](https://discourse.processing.org/t/why-does-windowwidth-not-trigger/23473)

<div class="topic-metadata">

**Author:** [@Clebosevic](https://discourse.processing.org/u/Clebosevic)\
**Replies:** 0\
**Last updated:** [August 24, 2020, 5:15pm UTC](https://discourse.processing.org/t/why-does-windowwidth-not-trigger/23473 "2020-08-24T17:15:51Z")

</div>

So my code is rather simple, it looks at an image and for every pixel brighter than a threshold, it puts a one there, which in turn just creates a interpretation of that image (code below): let grid = \[\]; const gridSize…

---

## [Trying to convert a basic grow shrink sketch from processing to p5.js](https://discourse.processing.org/t/trying-to-convert-a-basic-grow-shrink-sketch-from-processing-to-p5-js/23389)

<div class="topic-metadata">

**Author:** [@BackTo](https://discourse.processing.org/u/BackTo)\
**Replies:** 4\
**Last updated:** [August 24, 2020, 12:26pm UTC](https://discourse.processing.org/t/trying-to-convert-a-basic-grow-shrink-sketch-from-processing-to-p5-js/23389 "2020-08-24T12:26:31Z")

</div>

Hi, I’m trying to convert a processing 3 sketch that works to a p5.js and I can’t wrap my head around what the changes are or where to find a translation guide. I think if I can crack this conversion I’ll be able to do …

---

## [Create multiple custom rectangles in p5.js](https://discourse.processing.org/t/create-multiple-custom-rectangles-in-p5-js/23459)

<div class="topic-metadata">

**Author:** [@Axiang1225](https://discourse.processing.org/u/Axiang1225)\
**Replies:** 1\
**Last updated:** [August 24, 2020, 7:14am UTC](https://discourse.processing.org/t/create-multiple-custom-rectangles-in-p5-js/23459 "2020-08-24T07:14:43Z")

</div>

I’m beginning to explore p5.js web editor, and I was wondering if there is a way to create multiple custom rectangles with mouse in canvas.That’s the only way I can think of. I want it be like Illustrator’s rectangle too…

---

## [I need save values the list points and sum new values without sum id](https://discourse.processing.org/t/i-need-save-values-the-list-points-and-sum-new-values-without-sum-id/23334)

<div class="topic-metadata">

**Author:** [@Xremix31](https://discourse.processing.org/u/Xremix31)\
**Replies:** 2\
**Last updated:** [August 22, 2020, 10:27am UTC](https://discourse.processing.org/t/i-need-save-values-the-list-points-and-sum-new-values-without-sum-id/23334 "2020-08-22T10:27:42Z")

</div>

Hi, I need save the last values for sum new values in points to show the cards in the same position the player. But i have a problem when try first time the position is correct and the same numbers of dices, but when try…

---

## [Translating everything/ moving on the canvas](https://discourse.processing.org/t/translating-everything-moving-on-the-canvas/23409)

<div class="topic-metadata">

**Author:** [@Luis\_Luethi1](https://discourse.processing.org/u/Luis_Luethi1)\
**Replies:** 1\
**Last updated:** [August 21, 2020, 9:19am UTC](https://discourse.processing.org/t/translating-everything-moving-on-the-canvas/23409 "2020-08-21T09:19:48Z")

</div>

Hi, I want to move over my canvas by clicking and dragging. With the code below, the rect is getting reinstatiated every time the mouse is clicked. How can I change the code, so the rect is being translated from its new…

---

## [p5.Image is fuzzy](https://discourse.processing.org/t/p5-image-is-fuzzy/23395)

<div class="topic-metadata">

**Author:** [@Hapiel](https://discourse.processing.org/u/Hapiel)\
**Replies:** 10\
**Last updated:** [August 20, 2020, 11:42pm UTC](https://discourse.processing.org/t/p5-image-is-fuzzy/23395 "2020-08-20T23:42:05Z")

</div>

As soon as a p5.Graphics element gets stored in a p5.Image element, it gets a bit fuzzier. Some smoother anti alias I think. The effect is subtle, but visible to me. Is there a way to prevent this? I’m trying to make …

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

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