P5.js – symulacja masy na sprężynie z zewnętrzną siłą

Symulacja potrzebna do przygotowania efektu graficznego na pewne urządzenie.

Kółko reprezentuje masę poruszającą się wzdłuż osi X ze sprężyną zamocowaną w środku układu. Wprowadzono tłumienie prędkości symulujące opory otoczenia. Slider pozwala zaaplikować zewnętrzną siłę (można sobie to wyobrazić jak przechylanie kulki na desce przyczepionej sprężyną).

Kod:

let slider;

function setup() {
  createCanvas(400, 400);
  slider = createSlider(-100, 100, 0);
  slider.position(50, 350);
  slider.size(300);

}

let x=0, vel=0, a=0, f=0;
const mass = 50;
const k = .8;
const damping = 0.1;
function draw() {
  background(220);
  translate(width / 2, height / 2);
  point(0,0);

  f = -1*k*x+slider.value();
  a = f/mass; //external force
  vel += a;
  vel = vel - vel * damping;
  x+=vel;

  fill(0, 0, 0);
  text('x = '+x.toFixed(2), -180, -180);
  text('v = '+vel.toFixed(2), -180, -160);
  text('a = '+a.toFixed(2), -180, -140);
  text('f = '+f.toFixed(2), -180, -120);
  text('external force = '+slider.value(), -140, 140);
  fill(200, 200, 255);
  circle(x,0,10);
}

Demo: