Questions tagged [p5.js]

p5.js is a JavaScript library that starts with the original goal of processing, to make coding accessible for artists, designers, educators, and beginners, and reinterprets this for today’s web.

p5.js is a JavaScript library that starts with the original goal of processing, to make coding accessible for artists, designers, educators, and beginners, and reinterprets this for today’s web. p5.js has a full set of drawing functionality too.

See also:

3071 questions
1
vote
1 answer

Javascript P5, drawing a grid on a canvas

I'm carrying out a P5 assignment for college and struggling to understand some code I found online. I've included a screenshot of the output of the code and the actual code below. I understand the logic of creating the basic grid, but I was…
1
vote
0 answers

Error Create Canvas not defined- While trying to save sample project

I am trying to learn Java Script and I referring to Daniel Shiffman videos. I have installed Bracket and have downloaded the example project, On writing an implementation for setup and draw method I am getting the error [ERROR: createCanvas is not…
User27854
  • 824
  • 1
  • 16
  • 40
1
vote
1 answer

p5.js dragging objects incompatible with IE EDGE browsers

image of the problem hello, i am using p5.JS (0.10.2/p5.js) and having trouble with IE and Edge (Microsoft Edge 44.17763.831.0) browsers when it comes to dragging a shape (works fine on chrome). even when i use the official p5.JS on Edge it drags…
1
vote
1 answer

Specific blinking on p5js

I am new to p5.js and coding in general and having fun trying to code a mini scenario looking like a video game. I'd like to put a blinking effect that would look like this, on some text: I found a way to do it using frameRate(2);, the problem is…
Yunao
  • 13
  • 6
1
vote
0 answers

Alternative to DOM input fields using "native" P5js objects

While P5 supports integration of DOM elements, for the sketch I'm working on I would prefer to keep all graphic elements including the form input fields in the P5 canvas. Mainly to avoid maintaining parallel style methods in P5 and CSS and other…
Chris Amato
  • 135
  • 1
  • 7
1
vote
1 answer

map() in processingjs vs map() in JS

I see that processingjs (p5.js) uses map() to normalise a number from one range into another range. What do I do if I want to map a function across a list? In js, python, Haskell, scheme etc etc, I’d use map(fn, list)... I’ve tried to find this…
user2162871
  • 409
  • 3
  • 10
1
vote
1 answer

"Live" Webpage appears differently than the "offline" or "local" version

I am working on my website, and everything is looking fine on the main site, but when I visit the Pong game that I've made, it looks and behaves differently than my local flies. When I program, I paste the file path into Chrome and work on my game…
1
vote
2 answers

How to loop through functions by name in P5js / JavaScript

I'm working on a basic P5 program that requires up to ten input boxes. So I need to first create the button instances, using e.g. factor1Input = createInput(""); // create DOM element for input field factor1Input.position(leftMargin,…
Chris Amato
  • 135
  • 1
  • 7
1
vote
1 answer

Trouble adding third party libraries to chrome extension

Problem I am trying to add third party libraries to a chrome extension I am building. I am trying to dynamically add the script. I downloaded jquery and added it to the project. Then I tried to dynamically add p5.min.js and p5.dom.min.js using…
Yogort
  • 99
  • 1
  • 9
1
vote
1 answer

how to resolve promise when function is called? p5.js

var myPromise = new Promise(async function(resolve, reject){ // idon't want to resolve after 10seconds... i want to resovle it after show_me function get called and finsih it's job..... setTimeout(resolve, 10000) }); let xarr…
임도현
  • 15
  • 4
1
vote
2 answers

Having a problem loading setting 'WEBGL' to the createCanvas() method in P5.js

I'm trying to load a 3D model with P5.js in Angular 8. the syntax for creating a 3D canvas is createCanvas(100, 100, WEBGL); in Angular WEBGL is regarded as if it were a variable defined somewhere and throws this error. core.js:6014 ERROR Error:…
Optiq
  • 2,835
  • 4
  • 33
  • 68
1
vote
1 answer

How to properly rotate a custom shape in p5 JS and move it around the canvas without changing its angle?

I have been trying to rotate a custom shape I created with curve vertex using translate() and rotate(). I successfully rotated the shape, but when I change the position of the shape, its angle changes as well i.e. I cannot get the whole shape to…
Ms KK
  • 23
  • 1
  • 5
1
vote
2 answers

Is there a way to have JavaScript remember which part of an array was chosen at random?

I am trying to make a bot that can write poetry. I'm using p5js, which is based on JavaScript. For the actual output, I have: text("the"+" "+ random (subjectnonperson)+" "+ random (adverbs)+" " + random (affectingverb)+"s"+" "+ "the"+" "+ random…
Avi Moses
  • 13
  • 2
1
vote
2 answers

React router Link won't update route after if statement

I hope this question hasn't been answered yet somewhere and I haven't found it... So I'm still new to React.js but always trying new things with it, anyways. I've already done my research but none of the proposed solutions seem to work for me. I'll…
Sarquamon
  • 49
  • 2
  • 8
1
vote
1 answer

Creating Objects of Elements in P5.js

so i am trying to replicate output of this code: function setup() { createCanvas(400, 400); } var pts = []; var bts = []; function mousePressed() { if (pts.length == 2) { pts = []; } pts.push([mouseX, mouseY]) …
SilentHG
  • 109
  • 1
  • 12