p5.js

问题 Following the collision between a ball from an array and an object (rectangle), the ball doesn't seem to have the same bounce affect as it has when it hits the ground. When coming into contact with the object, it seems to pick up speed and suddenly glitches through and comes to rest on the ground. Questions: Why does it seem to want to rest on the ground and not on the object itself? How can I make the ball have the same bounce affect when coming into contact with the object as it has when

问题 I'm using p5js to program an animation with a timer countdown. I set my timer up to be updated each frame within an object that is being animated by the draw() function in sketch. Because of this, setInterval() will not work for what I'm trying to do. I thought I could use the frameRate and a frame counter to decide if a second has passed: this.updateTimer = function(){ this.framecounter++; if(this.framecounter > frameRate()){ this.framecounter = 0; //increment seconds } } Is this reliable? I

问题 Here I have a p5 object that I am exporting to be bundled by browserify: var p5 = require('p5') var colorPicker = require('./color_picker.js') module.exports = new p5(function () { this.setup = function setup () { this.createCanvas(700, 400) this.background(205) this.loadImage('/uploads/uploaded_image', function (img) { image(img, 0, 0) }) this.updatePixels() } this.clearCanvas = function redraw () { this.background('black') } this.mouseDragged = function mouseDragged () { var rgb =

问题 Let's say I have four different shapes rendered on a canvas from an object. var shapes = [ { shape1 : 'A cool Triangle', structure: triangle(40,40,40,40,40,40) }, { shape2 : 'A cool Rectangle', structure: rect(220,220,220,220) }, { shape3 : 'Another cool rectangle', structure: rect(140,140,140,140) } ] Then we render using a simple for loop in our setup code(which, for brevity's sake, I won't include). for(let shape in shapes){ // Really shouldn't be using for...in on this array for obvious

问题 My friend and I decided to create a platformer together as our computer science project. I am currently using an image function in p5.js library to swap between images and create animations for walking, jumping, etc. I looked up how it was done before for 2d games on systems such as Sega Mega Drive and NES, and understood that at the time pretty much all that was used for graphics in 2D space was sprites. After more research, I found out that sprites were made into a large image file with a

问题 Hi I'm creating a snake game right now and I have a problem that my food is not aligned with my snake so I can't get my snake to eat it, no error messsages just can't get that working, please explain where I went wrong and how I can get this to be aligned and eaten. Here is my code: My Food: function columns() { return floor(width / scl); } function rows() { return floor(height / scl); } function randomPlaceFood() { return createVector(floor(random(columns())), floor(random(rows()))); }

问题 I'm making a whack-a-mole game based on a 3x3 grid for one of my classes but i'm having trouble getting the mole(an ellipse made using p5.js) to move to a different grid square on click. I want it to automatically move after 7 seconds which i achieved using function sleep(milliseconds), but if the player clicks the mole before the 7 seconds is up then I want it to switch grid squares right then. This is my code for mousePressed and moveCircle. function mousePressed() { var distance = int(dist

问题 I intend to have an ellipse move smoothly between the stop points while keep rotating. It'll rotate for 1sec at point (20,50), transition to (40,70) on a smooth curve (bezier or random polynomial) and rotate till 3sec and move on to (160,190) The current issue is that it jumps between stop points rather than move smoothly. var angle=0; var x=[20,40,160] // x coordinates for stop points var y=[50,70,190] // y coordinates for stop points var t=[1000,2000,4000] // time for stop points var i=0;

问题 I made a galaxy sketch in p5.js using rotates and radians, but it's erased each time the background() is loaded as draw() runs. Is there a way to over-ride the background() function? I want the galaxies to remain in view. var stars; function preload(){ //for (var i = 0; i < planetArray.length; i++) { //stars = loadImage('Assets/stars.png'); } function setup(){ createCanvas(windowWidth, windowHeight); } function draw() { //background(0); star() //function mousepressed(){ } function star(){ /

问题 I’m an italian student, and I’m using p5’s libraries to create a web guitar tuner. I would like to know if there is a way to get the frequency of the microphone input. library link: https://p5js.org/reference/#/libraries/p5.sound Different solution with different libraries are accepted Thanks 回答1: Building off of this example, if you use P5.sound's FFT object, you can call fft.analyze() to get an array of amplitudes divided up into different frequency bins. The default is 1024 bins. These