Verlet integration bouncing

Question

I am trying to learn Verlet integration, mainly because I'm bored, and want to spice up my normal "bouncing ball" learning exercise.

I have a simple bouncing ball Canvas/HTML5 page at http://sandbox.electricgrey.com:8080/physics/. If you click on it you'll notice that the ball doesn't always bounce back to the same height. Sometimes it is higher, sometimes it is lower. Why is it doing that?

Is it because I am simplifying it too much? Do I really need to calculate partial time steps so I get exactly when/where the ball collides and then continue from there?

PS: If you have any comments about my HTML or Javascript, I would love to hear them. I'm just learning how to code with Javascript, and I want to make sure I am doing it The Right Way™.

Answer 1

In Verlet algorithm most important is time step taken to calculate next step. With of Verlet Algorithm you use: Basic or Velocity? What is your idea for collision with floor? I can see that collision point in not on the same height at every time. In this case, you have to calculate time to collision (t1) make move with t1, make collision and then make move with time (t_step - t1). I use this method in first implementation of this model

Answer 2

As Asar said you probably need to change the step size. Try something like the following and see if you can solve the problem by varying t.

    function Vertex(x,y,vx,vy,t) {
        this.t = t
        this.x = x;
        this.y = y;
        this.px = x-vx*t;
        this.py = y-vy*t;

        .......
        this.tick = function() {
            ....
            var tx = this.x;
            var ty = this.y;
            this.x = this.x + (this.x - this.px) + this.ax * this.t;
            this.y = this.y + (this.y - this.py) + this.ay * this.t;
            ....
          }  
  ....
}  

You could also gain some accuracy by changing the following method that, reverses the velocity of the ball, when it hits the floor.

if (this.y < this.r) {
    this.y = 2 * this.r - this.y;
    this.py = 2 * this.r - this.py;
}

If the ball bounces in the middle of a time step, then it travels in the direction of the gravitational force during the first part of the time step, but it travels away from the gravitational force during the last part of the time step. These two contributions should partly cancel each other. But in your code you assume that the gravitational force pulls the ball forward during the entire time step. You can account for this error by changing the formulas in the above method to include a term containing "this.ax * this.t". (But I am not fully sure how this term should look).

The best way to debug a program like this is to draw a graph where you have the time on the x-axis and the total mechanical energy on the y-axis. Then you can easily determine if you lose the energy during the bounces or during the normal time steps.

http://sandbox.electricgrey.com:8080/physics/physics.js