I’ve been working for some time on making a 3D first person camera in p5.js for games and random projects, but I’ve been having some trouble. For some time now I’ve been using a single y-rotation matrix with my projects to allow the player to look around, but I’ve felt like having an upgrade recently, so I decided to use
Tag: p5.js
How to display text sequentially using P5.js deviceMoved() function?
I am currently trying to make a program where the text changes as the phone moves every couple value(s) using the P5.JS deviceMoved() function. (the gif below displays how i wanted the text to change eventually as the device moved) As seen on the code below, I’ve put all the text in the array and I wanted to change the
Property ‘noise’ does not exist on type ‘typeof @types/p5/index”‘
I was humming along in a TypeScript Data Viz project and thought I’d use the p5.js noise function to save some time. Instead I’ve encountered a problem that I can’t fully understand. There seems to be something different with the p5 module compared to d3 and three.js I’m using in the project. Breaking it down to the very basic elements,
How can I change the angle of a vector when hitting an obstacle
So, my issue concerns vectors, I don’t know where I’m going with that case. I’m building a pandemic simulation (using Javascript and the library p5.js), and I’m trying to add a lockdown feature. Here is an image to make everything clearer: Essentially, at the moment, when two molecules collide, their velocity vector change appropriately by switching their former velocity. My
How can I use p5.js without it polluting the global scope?
I’m trying to convert some code I wrote for processing.js to use p5.js. In the existing code, I create an object with a statement like processing = new Processing(canvas, p => (p.draw = draw_frame)) with the canvas defined in HTML as <canvas id=”canvas”></canvas>, and any Processing functions and properties are attached to the processing object. For example, to draw a
Rotation facing mouse not correct with p5 libraries
i am making a javascript shooter game.i want the the player to rotate towards the mouse.it is working, but the rotation was not correct. I tried this with an image, and it works, but with the sprite itself(player1), is not. i have asked this once before but received no answer I am a beginner in javascript, so help would be
Redraw Canvas via p5 with deleting the old canvas
I want to visualize my sorting algorithms and redraw the created Canvas each time. My Old Canvas keeps all the old values. It just creates a new Canvas and puts it above the old Canvas. But I thought with the redraw I could solve it. I also tried to delete the canvas via canvas.remove() and create a completly new one
how do I create an alternating stripe pattern with different stripe widths in javascript
I am trying to create a stripe pattern in javascript (p5.js), where the odd stripes are one width and the even are another. If they were the same width, my code to create the pattern would be as follows: but if I were to introduce a barSize1 and barSize2 to create an alternating pattern of bars of different heights (say
How can I share methods that call P5.js functions between two different sketches/canvases?
Is there a way to share common methods between two different sketches/canvases? It only works if I’m not referencing any P5.js methods. In the example below there are two sketches and each is loaded into a different canvas element using the instance mode for P5.js. I’d like to be able to write a function that uses P5.js methods AND is
Multiple p5.js Canvases in the same page [duplicate]
This question already has answers here: Can I create multiple canvas elements on same page using p5js (2 answers) Closed last month. although I have some experience with processing, I am new to p5.js. For an academic work, I want to create a website with multiple interactive experiences. I want this website to be one single page, no links no