# p5.js

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

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

**Page:** 90

---

## [Draw a line from center to mouse with vector](https://discourse.processing.org/t/draw-a-line-from-center-to-mouse-with-vector/12729)

<div class="topic-metadata">

**Author:** [@Erjaeger](https://discourse.processing.org/u/Erjaeger)\
**Replies:** 5\
**Last updated:** [July 16, 2019, 9:53am UTC](https://discourse.processing.org/t/draw-a-line-from-center-to-mouse-with-vector/12729 "2019-07-16T09:53:25Z")

</div>

Hi everyone, I’m reading The Nature of Code but I stuck with a stupid question on vector. I tried to make a line drawn from the center of the screen to my mouse with the help of vectors. Here : https://editor.p5js.org…

---

## [Sound in p5.js gives warnings](https://discourse.processing.org/t/sound-in-p5-js-gives-warnings/12731)

<div class="topic-metadata">

**Author:** [@Checkers99](https://discourse.processing.org/u/Checkers99)\
**Replies:** 1\
**Last updated:** [July 16, 2019, 12:36am UTC](https://discourse.processing.org/t/sound-in-p5-js-gives-warnings/12731 "2019-07-16T00:36:16Z")

</div>

Hello, I’m currently trying to add sound to a p5.js sketch but i keep getting these ‘warnings’? This is the source of the problem i think… If I write the preload code and loadSound I then get error codes from the p5 s…

---

## [Merge/ blend p5.Image or base64 image](https://discourse.processing.org/t/merge-blend-p5-image-or-base64-image/12699)

<div class="topic-metadata">

**Author:** [@josebv](https://discourse.processing.org/u/josebv)\
**Replies:** 2\
**Last updated:** [July 15, 2019, 12:02pm UTC](https://discourse.processing.org/t/merge-blend-p5-image-or-base64-image/12699 "2019-07-15T12:02:57Z")

</div>

Hi, im currently working on a paint-like project. right now I have 3 p5.images: \*template // this is kinda of legal notepad \*doodles // a canvas were I draw \*oldDoodles // old doodles that I get from my database is …

---

## [How can i color or texture each faces of a loaded .obj file?](https://discourse.processing.org/t/how-can-i-color-or-texture-each-faces-of-a-loaded-obj-file/12688)

<div class="topic-metadata">

**Author:** [@mraposka](https://discourse.processing.org/u/mraposka)\
**Replies:** 1\
**Last updated:** [July 14, 2019, 3:49pm UTC](https://discourse.processing.org/t/how-can-i-color-or-texture-each-faces-of-a-loaded-obj-file/12688 "2019-07-14T15:49:08Z")

</div>

I’m doing a 3D object texturing and coloring website. (For example a kitchen set. I want to change color or texture the kitchen cupboards, marble and fridge.) I’m loading the 3d kitchen set model on website. Customer sho…

---

## [How can I not draw on top of something](https://discourse.processing.org/t/how-can-i-not-draw-on-top-of-something/10793)

<div class="topic-metadata">

**Author:** [@josebv](https://discourse.processing.org/u/josebv)\
**Replies:** 18\
**Last updated:** [July 14, 2019, 12:22pm UTC](https://discourse.processing.org/t/how-can-i-not-draw-on-top-of-something/10793 "2019-07-14T12:22:22Z")

</div>

I’m trying to program something for my cs class. I want to make a program that I can use to write notes with my Wacom tablet. the problem is that I don’t know how not draw things on top of each other. when I erased so…

---

## [Is there a way to load pictures from client without preload?](https://discourse.processing.org/t/is-there-a-way-to-load-pictures-from-client-without-preload/12686)

<div class="topic-metadata">

**Author:** [@josebv](https://discourse.processing.org/u/josebv)\
**Replies:** 2\
**Last updated:** [July 12, 2019, 8:06pm UTC](https://discourse.processing.org/t/is-there-a-way-to-load-pictures-from-client-without-preload/12686 "2019-07-12T20:06:31Z")

</div>

Im thinking maybe like a button that opens a finder window so I can load the picture

---

## [Creating and Populating a Table From Scratch](https://discourse.processing.org/t/creating-and-populating-a-table-from-scratch/12658)

<div class="topic-metadata">

**Author:** [@hbtousa](https://discourse.processing.org/u/hbtousa)\
**Replies:** 11\
**Last updated:** [July 12, 2019, 4:13am UTC](https://discourse.processing.org/t/creating-and-populating-a-table-from-scratch/12658 "2019-07-12T04:13:55Z")

</div>

Hello everyone. Completely new to P5JS. I am trying to create a table and populate it with data already collected by the same code.The table will have three columns: name, position\_x, and position\_y. The code below didn…

---

## [Getting a strange error while using shader](https://discourse.processing.org/t/getting-a-strange-error-while-using-shader/12522)

<div class="topic-metadata">

**Author:** [@Sudev](https://discourse.processing.org/u/Sudev)\
**Replies:** 5\
**Last updated:** [July 11, 2019, 4:32pm UTC](https://discourse.processing.org/t/getting-a-strange-error-while-using-shader/12522 "2019-07-11T16:32:29Z")

</div>

Am getting a very strange error when I use shader in my sketch. Uncaught TypeError: Cannot read property 'isP3D' of undefined (sketch: line 5) and this is the code let img; function preload(){ img = loadImage('htt…

---

## [About creating an add on to draw graphs in p5](https://discourse.processing.org/t/about-creating-an-add-on-to-draw-graphs-in-p5/12613)

<div class="topic-metadata">

**Author:** [@Jithin](https://discourse.processing.org/u/Jithin)\
**Replies:** 2\
**Last updated:** [July 10, 2019, 3:27pm UTC](https://discourse.processing.org/t/about-creating-an-add-on-to-draw-graphs-in-p5/12613 "2019-07-10T15:27:58Z")

</div>

I’m thinking of creating a library for drawing graphs in p5 sketch. We may provide options like where the origin is, dimensions of the graph, width of each unit in each axes, labels, function to be plotted etc. A graph w…

---

## [P5js Project Template for ATOM](https://discourse.processing.org/t/p5js-project-template-for-atom/12491)

<div class="topic-metadata">

**Author:** [@mat650](https://discourse.processing.org/u/mat650)\
**Replies:** 4\
**Last updated:** [July 9, 2019, 4:11pm UTC](https://discourse.processing.org/t/p5js-project-template-for-atom/12491 "2019-07-09T16:11:41Z")

</div>

I was searching for a way to create rapidly new p5.js projects by template in Atom, but I have found none so I made mine and I hope it can help you as well: https://github.com/MatteRohrn/p5jsProjectTemplateForAtom It r…

---

## [Make class get all functions of p5.js](https://discourse.processing.org/t/make-class-get-all-functions-of-p5-js/12558)

<div class="topic-metadata">

**Author:** [@Choky](https://discourse.processing.org/u/Choky)\
**Replies:** 1\
**Last updated:** [July 9, 2019, 7:10am UTC](https://discourse.processing.org/t/make-class-get-all-functions-of-p5-js/12558 "2019-07-09T07:10:23Z")

</div>

When creating a class I cannot make it so the class gets all the functions of p5.js library. Can anyone help me? it says fill is not defined code : var game = function(g) { g.setup = function() { g.createCanvas(…

---

## [Issue "promises" creating a model P5.js and Tensorflow.js](https://discourse.processing.org/t/issue-promises-creating-a-model-p5-js-and-tensorflow-js/12532)

<div class="topic-metadata">

**Author:** [@dinda](https://discourse.processing.org/u/dinda)\
**Replies:** 3\
**Last updated:** [July 9, 2019, 1:27am UTC](https://discourse.processing.org/t/issue-promises-creating-a-model-p5-js-and-tensorflow-js/12532 "2019-07-09T01:27:14Z")

</div>

Hello!!! How are you? I am trying to fit a model to predict 3 vectors (x, y coordinates) when I show them 28x28px image tensors. I’m also doing it in P5.js because I want it to work in the browser. The thing is that …

---

## [Coding problem(character Animation Program)](https://discourse.processing.org/t/coding-problem-character-animation-program/12598)

<div class="topic-metadata">

**Author:** [@megarou](https://discourse.processing.org/u/megarou)\
**Replies:** 1\
**Last updated:** [July 9, 2019, 1:03am UTC](https://discourse.processing.org/t/coding-problem-character-animation-program/12598 "2019-07-09T01:03:46Z")

</div>

Hello there, i’m facing a some kind of coding problem?!!, the problem is, i’ve loaded some images of a character to animate, i’ve succeeded to animate the first loaded images of the character, but i couldn’t know how to …

---

## [textBounds() -- can it be used on the default font?](https://discourse.processing.org/t/textbounds-can-it-be-used-on-the-default-font/12578)

<div class="topic-metadata">

**Author:** [@drail](https://discourse.processing.org/u/drail)\
**Replies:** 1\
**Last updated:** [July 8, 2019, 3:58pm UTC](https://discourse.processing.org/t/textbounds-can-it-be-used-on-the-default-font/12578 "2019-07-08T15:58:08Z")

</div>

If I want to make a background just behind some text that I draw on the canvas, I could draw a box behind the text, and I would get the box’s position and size with the textBounds() method. Can this be done with the def…

---

## [Google posenet dependencies missing!](https://discourse.processing.org/t/google-posenet-dependencies-missing/12454)

<div class="topic-metadata">

**Author:** [@Sparrow](https://discourse.processing.org/u/Sparrow)\
**Replies:** 7\
**Last updated:** [July 7, 2019, 10:56pm UTC](https://discourse.processing.org/t/google-posenet-dependencies-missing/12454 "2019-07-07T22:56:42Z")

</div>

Hey guys! Just wanted to thank you for setting up p5js, it is an enormous help with rapid prototyping stuff! So I’ve been using posenet on p5js extensively for a university project in time and motion studies, works like…

---

## [\[SOLVED\] Properties in Processing](https://discourse.processing.org/t/solved-properties-in-processing/12569)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 4\
**Last updated:** [July 7, 2019, 9:22pm UTC](https://discourse.processing.org/t/solved-properties-in-processing/12569 "2019-07-07T21:22:00Z")

</div>

I’m converting a project from p5.js to processing and am struggling to find the equivalent in processing. I’m using the p5.js properties var a = {}; so that I can later access and update this variable as such; var b =…

---

## [Web editor -- offline?](https://discourse.processing.org/t/web-editor-offline/12399)

<div class="topic-metadata">

**Author:** [@shedMusic](https://discourse.processing.org/u/shedMusic)\
**Replies:** 10\
**Last updated:** [July 6, 2019, 6:53pm UTC](https://discourse.processing.org/t/web-editor-offline/12399 "2019-07-06T18:53:20Z")

</div>

Just making the move to p5.js from the Processing IDE… and have also been using the now deprecated/old P5 editor. I am wanting to code if possible without any internet access, so is it possible to have a local copy of t…

---

## [Mp3 jukebox in background](https://discourse.processing.org/t/mp3-jukebox-in-background/9843)

<div class="topic-metadata">

**Author:** [@peor](https://discourse.processing.org/u/peor)\
**Replies:** 11\
**Last updated:** [July 5, 2019, 9:15pm UTC](https://discourse.processing.org/t/mp3-jukebox-in-background/9843 "2019-07-05T21:15:51Z")

</div>

In like this https://p5js.org/examples/sound-preload-soundfile.html but then want a sequence of several mp3 files that are played one track where there are also fade in and fade out for each track. Can you help me how I …

---

## [Counting football juggles via webcam (p5js)](https://discourse.processing.org/t/counting-football-juggles-via-webcam-p5js/12430)

<div class="topic-metadata">

**Author:** [@joymkj](https://discourse.processing.org/u/joymkj)\
**Replies:** 6\
**Last updated:** [July 5, 2019, 5:47pm UTC](https://discourse.processing.org/t/counting-football-juggles-via-webcam-p5js/12430 "2019-07-05T17:47:37Z")

</div>

Hi! I want to create an application which can count how many football juggles (feet, knee, head etc.) has been performed through the webcam live feed. I have implemented pose estimation and object tracking but it is too…

---

## [Is it possible to perform p5js.sound FFT for the whole audio input without playing it back?](https://discourse.processing.org/t/is-it-possible-to-perform-p5js-sound-fft-for-the-whole-audio-input-without-playing-it-back/12318)

<div class="topic-metadata">

**Author:** [@fftnana](https://discourse.processing.org/u/fftnana)\
**Replies:** 1\
**Last updated:** [July 5, 2019, 2:24pm UTC](https://discourse.processing.org/t/is-it-possible-to-perform-p5js-sound-fft-for-the-whole-audio-input-without-playing-it-back/12318 "2019-07-05T14:24:14Z")

</div>

Hi all, I am currently working on an audio plotting/visualizer project which takes in amplitude of the audio input and also FFT for more data, so that the resulting plot/image will be more variative. As for amplitude, …

---

## [Change Font Weight in p5](https://discourse.processing.org/t/change-font-weight-in-p5/12514)

<div class="topic-metadata">

**Author:** [@redmoncoreyl](https://discourse.processing.org/u/redmoncoreyl)\
**Replies:** 3\
**Last updated:** [July 5, 2019, 3:20am UTC](https://discourse.processing.org/t/change-font-weight-in-p5/12514 "2019-07-05T03:20:43Z")

</div>

I want to have a p5 sketch with the same font but multiple weights. In my index.html I have the following line: \<link href="https://fonts.googleapis.com/css?family=Montserrat:400,800&display=swap" rel="stylesheet"\> In …

---

## [(p5js) how can i structure an if then statement so that a few but not all conditions are met?](https://discourse.processing.org/t/p5js-how-can-i-structure-an-if-then-statement-so-that-a-few-but-not-all-conditions-are-met/12394)

<div class="topic-metadata">

**Author:** [@cryptacritic](https://discourse.processing.org/u/cryptacritic)\
**Replies:** 10\
**Last updated:** [July 5, 2019, 2:24am UTC](https://discourse.processing.org/t/p5js-how-can-i-structure-an-if-then-statement-so-that-a-few-but-not-all-conditions-are-met/12394 "2019-07-05T02:24:56Z")

</div>

Imagine you have ten boolean (or otherwise) variables. You want three of the ten variables to be true, but no more than 3, and no less. You do not want to create a complicated nested if-then function that requires writin…

---

## [Strange behavior from a sketch](https://discourse.processing.org/t/strange-behavior-from-a-sketch/12492)

<div class="topic-metadata">

**Author:** [@rbytes](https://discourse.processing.org/u/rbytes)\
**Replies:** 7\
**Last updated:** [July 4, 2019, 10:09pm UTC](https://discourse.processing.org/t/strange-behavior-from-a-sketch/12492 "2019-07-04T22:09:30Z")

</div>

I recently translated this sketch, Dynafractal, to P5.js from another language (Smart Basic, if anyone is familiar with it.) My code runs fine, and the final output looks exactly like it did in Smart Basic, but it doe…

---

## [\[SOLVED\] Ordering items on canvas](https://discourse.processing.org/t/solved-ordering-items-on-canvas/12421)

<div class="topic-metadata">

**Author:** [@paulgoux](https://discourse.processing.org/u/paulgoux)\
**Replies:** 6\
**Last updated:** [July 4, 2019, 7:24pm UTC](https://discourse.processing.org/t/solved-ordering-items-on-canvas/12421 "2019-07-04T19:24:30Z")

</div>

Hi, I’m having trouble ordering drawn items on canvas, I’m looking to draw the path and the info table on top of the fill, however this is causing some issues. This is the function which draws, the items on canvas, f…

---

## [Empty p5js Template File (Link to GitHub download)](https://discourse.processing.org/t/empty-p5js-template-file-link-to-github-download/7352)

<div class="topic-metadata">

**Author:** [@faxinadu](https://discourse.processing.org/u/faxinadu)\
**Replies:** 1\
**Last updated:** [July 3, 2019, 10:17pm UTC](https://discourse.processing.org/t/empty-p5js-template-file-link-to-github-download/7352 "2019-07-03T22:17:07Z")

</div>

Empty template for a p5js project with ready to use html, css and js files. Expands a bit on the other empty project examples. Includes a reference to css class for the sketch, preload-setup-draw functions with some qui…

---

## [Zooming in on specific point. (Translate and scale)](https://discourse.processing.org/t/zooming-in-on-specific-point-translate-and-scale/12310)

<div class="topic-metadata">

**Author:** [@Kiwipai](https://discourse.processing.org/u/Kiwipai)\
**Replies:** 5\
**Last updated:** [July 3, 2019, 4:36am UTC](https://discourse.processing.org/t/zooming-in-on-specific-point-translate-and-scale/12310 "2019-07-03T04:36:12Z")

</div>

So I’m fairly new to graphical programming and I’m stuck at something that I’m guessing has a simple solution. I want to make some lines out of points and then translate and scale so that my lines will be visible no mat…

---

## [Poster Generator: Sketch should not automatically redraw (p5js + p5gui)](https://discourse.processing.org/t/poster-generator-sketch-should-not-automatically-redraw-p5js-p5gui/12437)

<div class="topic-metadata">

**Author:** [@kr1schiii](https://discourse.processing.org/u/kr1schiii)\
**Replies:** 5\
**Last updated:** [July 2, 2019, 6:40pm UTC](https://discourse.processing.org/t/poster-generator-sketch-should-not-automatically-redraw-p5js-p5gui/12437 "2019-07-02T18:40:45Z")

</div>

Hey guys, I’m trying to build a simple pattern generator to create posters for some design idea. I’m using mainly p5.js and also the p5.gui library to have an interface to control some functions. During this process I …

---

## [Loosing quality using createGraphics](https://discourse.processing.org/t/loosing-quality-using-creategraphics/12279)

<div class="topic-metadata">

**Author:** [@josebv](https://discourse.processing.org/u/josebv)\
**Replies:** 1\
**Last updated:** [July 1, 2019, 1:40pm UTC](https://discourse.processing.org/t/loosing-quality-using-creategraphics/12279 "2019-07-01T13:40:28Z")

</div>

Hi, first of all I wanna clarify that im a noob. Im trying to make a program like notability using p5.js Ive been using the p5 web editor but know im using vs code (don’t think is relevant) the problem is that, I don’…

---

## [Timer function help](https://discourse.processing.org/t/timer-function-help/12373)

<div class="topic-metadata">

**Author:** [@dackdel](https://discourse.processing.org/u/dackdel)\
**Replies:** 3\
**Last updated:** [July 1, 2019, 10:52am UTC](https://discourse.processing.org/t/timer-function-help/12373 "2019-07-01T10:52:37Z")

</div>

to explain the whole program as it is now: there are 6 tracks. I have speech recognition running where user speech is detected and when he speaks the first track is played fully and stopped when the track is over. then i…

---

## [How would you get two separate sketches to interact?](https://discourse.processing.org/t/how-would-you-get-two-separate-sketches-to-interact/12368)

<div class="topic-metadata">

**Author:** [@KeirMeDear](https://discourse.processing.org/u/KeirMeDear)\
**Replies:** 3\
**Last updated:** [June 30, 2019, 11:41pm UTC](https://discourse.processing.org/t/how-would-you-get-two-separate-sketches-to-interact/12368 "2019-06-30T23:41:32Z")

</div>

Theoretically, how would you get two separate sketches to work together on the same website. For example, I am looking at having two sketches, one in 2d processing as a control system and the second in 3d processing as …

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

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