Bewegung mit konstanter Beschleunigung

Freier Fall eines Gegenstandes

<!DOCTYPE html><html><body>
<canvas id="myCanvas" width="300" height="600" style="border:1px solid #d3d3d3;">Your browser does not support the HTML5 canvas tag.</canvas>
<script>"use strict";
//Statische Methoden werden über den Klassen-Namen aufgerufen, sodass das Objekt nicht initialisiert werden mussclass Leinwand{  static lesenKonstante(){    this.canvas = document.getElementById("myCanvas");    this.ctx = this.canvas.getContext("2d");  }}Leinwand.lesenKonstante();
class Punkt{  constructor(Radius){    this.Radius=Radius;  }  zeichnen(x,y){    this.x=x;    this.y=y;    Leinwand.ctx.beginPath();    Leinwand.ctx.arc(this.x, this.y, this.Radius, 0, 2 * Math.PI);    Leinwand.ctx.fillStyle="black";    Leinwand.ctx.fill();    Leinwand.ctx.stroke();  }  bewegen(ax,ay){    var dt=0.1;        var dvx=ax*dt;    var dvy=ay*dt;    this.vx=this.vx+dvx;      this.vy=this.vy+dvy;     var dx=this.vx*dt;    var dy=this.vy*dt;    this.x=this.x+dx;    this.y=this.y+dy;  }}
//Die Animation funktioniert nur mit einer statischen Methodeclass Animation{static Start(){    Leinwand.ctx.clearRect(0, 0, Leinwand.canvas.width, Leinwand.canvas.height);    Punkt1.zeichnen(Punkt1.x,Punkt1.y);    Punkt1.bewegen(0,10);    window.requestAnimationFrame(Animation.Start);  }}
var Punkt1=new Punkt(10);Punkt1.zeichnen(100,10);Punkt1.vx=0;Punkt1.vy=0;Animation.Start();</script> 
</body></html>