Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	Soft-body bouncing ball simulation
ID	5041077621227520
Created	9 years ago, 1455545835290
Updated	9 years ago, 1455546016313
Code	/* * A simple soft-body frictionless ball simulation. Click to drag it around. * * This time I'm using implicit Euler integration instead of Verlet integration. * It is again just a simple demonstration of what funny things you can do without * too much complex code or math. * * I hope you guys like it ^^. / // Render settings var unitScale = 30; var targetFrameRate = 60; // Configuration var ballRadius = 1.5; // In meters var ballPoints = 25.0; // Amount of subdivisions from the circle var gravityX = 0.0; // In Newtons var gravityY = 9.8; // In Newtons (it's Y-down) var density = 0.5; // kg/m^2 var bounciness = 0.9; // % of energy preserved in a collision var sturdyness = 60; // In Newtons/%, not sure what the proper name is // for this variable, so I named it like this. var mouseForce = 10; // In Newtons/m^2, where m^2 is the distance to the mouse // Start in the center var ballStartX = width / 2 / unitScale; var ballStartY = height / 2 / unitScale; // Classes var Point = function (x, y) { this.posX = x; this.posY = y; this.velX = 0; this.velY = 0; this.oldVelX = 0; this.oldVelY = 0; }; // Working data var mass; // In kg var deltaTime; // In seconds var points = []; var pointDists = []; var mouseTarget = -1; // Forward declare the functions var simulate, init, draw; var simulateMouseForce, simulateVelocity, simulatePosition; var initPoints; var drawCircle; simulate = function () { simulateMouseForce(); simulateVelocity(); simulatePosition(); }; init = function () { frameRate(targetFrameRate); deltaTime = 1 / targetFrameRate; ballPoints = max(3, ballPoints); // Calculate the mass of a point var ballArea = PI ballRadius * ballRadius; mass = ballArea * density; initPoints(); }; draw = function () { background(255, 255, 255); fill(0, 0, 0); simulate(); drawCircle(); }; simulateMouseForce = function () { // Move towards mouse if applicable if (mouseTarget === -1) { return; } var mx = mouseX / unitScale; var my = mouseY / unitScale; var p = points[mouseTarget]; var dx = mx - p.posX; var dy = my - p.posY; p.velX += dx * mouseForce * mass; p.velY += dy * mouseForce * mass; }; simulateVelocity = function () { var i; // Apply gravity for (i = 0; i < points.length; i++) { points[i].velX += gravityX * mass * deltaTime; points[i].velY += gravityY * mass * deltaTime; } // Make a copy of the old velocities for (i = 0; i < points.length; i++) { points[i].oldVelX = points[i].velX; points[i].oldVelY = points[i].velY; } // Apply constraints to keep the ball in shape for (i = 0; i < points.length - 1; i++) { var p1 = points[i]; for (var j = i + 1; j < points.length; j++) { var targetDist = pointDists[j - i]; var p2 = points[j]; var dx = p1.posX - p2.posX + deltaTime * (p1.oldVelX - p2.oldVelX); var dy = p1.posY - p2.posY + deltaTime * (p1.oldVelY - p2.oldVelY); var dist = sqrt(dx * dx + dy * dy); var force = (dist - targetDist) / targetDist * sturdyness; var dirX = dx / dist; var dirY = dy / dist; p1.velX -= dirX * force * mass * deltaTime; p1.velY -= dirY * force * mass * deltaTime; p2.velX += dirX * force * mass * deltaTime; p2.velY += dirY * force * mass * deltaTime; } } }; simulatePosition = function () { var simW = width / unitScale; var simH = height / unitScale; for (var i = 0; i < points.length; i++) { var p = points[i]; p.posX += p.velX * deltaTime; p.posY += p.velY * deltaTime; // Perform collision checking with canvas boundaries // The code commented out would do proper reflections, // but to me it looks better without. if (p.posX < 0) { p.posX = 0;//-p.posX; p.velX = -bounciness; } if (p.posX >= simW) { p.posX = simW;// 2 - p.posX; p.velX = -bounciness; } if (p.posY < 0) { p.posY = 0;//-p.posY; p.velY = -bounciness; } if (p.posY >= simH) { p.posY = simH;// * 2 - p.posY; p.velY = -bounciness; } } }; initPoints = function () { // Use some linear algebra tricks to efficiently // calculate a new position for multiple points. var anglePerPoint = 360 / ballPoints; var rotVecX = cos(anglePerPoint); var rotVecY = sin(anglePerPoint); var x = ballRadius; var y = 0; var i; // Create all points for (i = 0; i < ballPoints; i++) { points.push(new Point(x + ballStartX, y + ballStartY)); // Rotate position [ x, y ] by [ rotVecX, rotVecY ] var x1 = x rotVecX; var y1 = x * rotVecY; var x2 = y * -rotVecY; var y2 = y * rotVecX; x = x1 + x2; y = y1 + y2; } // Calculate the distance from each point to the others for (i = 0; i < ballPoints; i++) { var dx = points[i].posX - ballRadius - ballStartX; var dy = points[i].posY - ballStartY; var dist = sqrt(dx * dx + dy * dy); pointDists.push(dist); } }; drawCircle = function () { fill(192, 192, 192); stroke(0, 0, 0); strokeWeight(1.5); beginShape(); for (var i = 0; i < points.length; i++) { vertex(points[i].posX * unitScale, points[i].posY * unitScale); } endShape(CLOSE); }; mousePressed = function () { var mx = mouseX / unitScale; var my = mouseY / unitScale; // Find nearest point to mouse var nearestIndex = 0; var nearestSqrDist = 0; for (var i = 0; i < points.length; i++) { var dx = points[i].posX - mx; var dy = points[i].posY - my; var sqrDist = dx * dx + dy * dy; if ((i === 0) \|\| (sqrDist < nearestSqrDist)) { nearestIndex = i; nearestSqrDist = sqrDist; } } mouseTarget = nearestIndex; }; mouseReleased = mouseOut = function () { mouseTarget = -1; }; init();
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgJjH1Zr6CAw
Votes	311
Spin-Offs	45
Type	PJS
Width	400
Height	400
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Aidiakapi
Author Name	Aidiakapi
Author ID	kaid_607779491293615281646846
Author Profile Access	PUBLIC

Archive Data

Added	6 months ago, 1739373703510
Updated	4 months ago, 1744844813832
Source Deleted	unknown