Visualizing Differential Equations, III

The experiment in visualizing differential equations graduates to second order systems with this example. The graph is based on a phase plane diagram for an autonomous system in x and y. Each line is a solution to the system, and the animation illustrates how each solution evolves in time.

Note: The speed of the animation does not represent the speed as which each solution evolves. Faithfully reproducing the solution velocities would require a more computationally intensive animation technique that would make the visualization impractical in typical web browsers.

The default system has a stable equilibrium point at (0,0), so points near the origin spiral in towards (0,0). All solutions except the one that starts at (0,0) take an infinite amount of time to get there, however. The system also has an equilibrium on the unit circle (a circle of radius 1). That equilibrium is unstable, though. Solutions that start outside the unit circle spiral off to infinity as time increases. Solutions that start inside the unit circle are attracted to the stable equilibrium at (0,0).

In addition to defining the system of equations and the graph’s range, the controls allow adjustment of the graph’s behavior. Those controls include:

• # The number of solutions to show. More solutions result in a denser grid, but can also take significantly more time to compute.
• pts The number of points to show in each solution. More points extend the length of the solution lines (for those solutions that remain in the region of the graph), but also take more time to compute.
• ∆t The increment of time to use for approximating the differential equations. Smaller time increments can result in smoother solution lines, but at the expense of more computational time.
• T The total time for each animation loop. Use this control to slow down or speed up the animation.

There’s also a Play/Pause button that suspends and resumes the animation.

Feel free to experiment with different equations and parameters. The functions for ẋ and ẏ should be a valid JavaScript expressions. There’s no error checking, though, so be careful.

This series of visualizations begins with part I.