O'Reilly logo

HTML5 Canvas Cookbook by Eric Rowell

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Simulating particle physics

Now that we've covered the basics of classical physics, let's put it all together. In this recipe, we'll simulate particle physics by modeling gravity, boundary conditions, collision damping, and floor friction.

Simulating particle physics

How to do it...

Follow these steps to launch a particle inside the canvas and observe it's projectile path as it bounces on the walls, gradually falls down to the floor due to gravity, and then slows to a stop due to floor friction:

  1. Link to the Animation class:
    <head>
        <script src="animation.js">
        </script>
  2. Define the applyPhysics() function which takes a particle as input and updates its position and velocity based ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required