The path of a point fixed relative to a circle that rolls along a straight line is called a trochoid. The easiest way to visualize this phenomenon is to think of the path of a reflector on a bicycle as someone is riding on a level street. The reflector rotates around the hub of the wheel, but yet the hub of the wheel is moving relative to the ground. Here is an applet that demonstrates this (without the bicycle) (NOTE: As of 10/6/00, I have rewritten the cycloid applet. I had received some comments suggesting that the old version caused some computers to crash. Hopefully the problem has been fixed. Let me know if you experience any further problems.)

Now think about what happens if the circle is instead rotating around another circle. In other words, the cyclist is now pedaling his/her way around the equator, instead of down the street. Mathematicians call this path an epicycloid. The rest of the world calls them SpiroGraphs!! The parametric equations for these curves are given by:

x(t)=(R+r)cos(t) + p*cos((R+r)t/r)
y(t)=(R+r)sin(t) + p*sin((R+r)t/r)

where R,r, and p are defined below. The applet below allows you to create all the SpiroGraphs your heart desires by varying the values of R, r and p, as well as the following parameters:

  • Radius1 (R)
  • Radius of circle (equator) centered at the origin.
  • Radius2 (r)
  • Radius of circle (bicycle wheel) centered at (R+r,0)
  • Position (p)
  • Distance of Point (reflector) from the center of Circle2, the circle of radius r.
  • Velocity
  • Speed at which the SpiroGraph is drawn, with 0 being the slowest and 10 being the fastest. Can be adjusted while drawing is taking place. Sometimes half the fun is seeing your SpiroGraph being drawn! Sometimes not!
  • Resolution
  • Controls how precise the SpiroGraph is drawn. For instance, with a Resolution of 360, the points (x(t),y(t)) are plotted for t=0,1,2,3,4,5,...,359,360 degrees. With a Resolution of 180, only the values of t=0,2,4,6,8,10,...,358,360 are used. Be careful, the larger the Resolution, the longer it will take to draw the SpiroGraph. Normally, a value between 270 and 360 will be good enough. With a small value of Radius2 (say Radius2=1), a small change in Resolution can result in remarkably different SpiroGraphs.
  • Hide/Show
  • Changing the value of this button will determine whether or not to display the circles/axes while drawing is taking place. Note: SpiroGraphs are drawn much faster if you "Hide" the circles/axes.
  • Clear
  • This button will clear the screen of all SpiroGraphs.
  • Reset
  • This button stops the current SpiroGraph and returns Circle2 and the Point to its original position
  • Draw/Pause/Resume
  • These buttons should be self explanatory.
  • Red/Green/Blue
  • You can adjust the values of these sliders to draw your SpiroGraph in virtually any color you like!

    © 1997 David P. Little
    Download this applet for off-line viewing (includes source code)

    SIMPLE CURVES Radius1Radius2PositionResolution Try this:
    Cardioid 606060270 See what happens when you vary the postion to the left or to the right. How could you get a cardioid oriented differently?
    Astroid 60-15-15270 Another name for an astroid is a hypocycloid of four cusps. What would you change to get the same picture rotated 45 degrees? Vary the radius and try to get 3,5 or 6 cusps. Also, vary the position and see what happens.
    Four-leaved rose 60-1545270 Try to vary the radius and postion to get 3,5 or 6 leaves
    Vertical Line 60-30-30270 What would you change to get a horizontal line?
    Ellipse 60-30-90270 What would you have to change in order to get an ellipse oriented horizontally? How would you get an ellipse on the inside of the fixed circle?
    Rounded Square 60-45-101270 How about a rounded triangle or pentagon?
    Gold fish 75-2585270 This is supposed to be fun, right?
    Star fish 75-3060270 Come on, you're enjoying this!
    Spiral In, Spiral Out 56060270
    Rotating Triangle 901105270 Change the value of Radius 1 just slightly, and see how much the Spirograph changes!! Make sure to turn the velocity down low, or the drawing will take place too fast to see the triangle being rotated.
    Experiment with Resolution 60112260 Try changing the Resolution to 61, 62, 63. How do you explain this behavior?
    String of Pearls 10049667

    STRANGE PHENOMENON Radius1Radius2PositionResolution Comments:
    Orbit 6059801 Make sure you turn the velocity down low. See what happens when you change the value of Radius2 to 61. Change the resolution to 2 and you'll be seeing double.

    COMPLEX CURVES Radius1Radius2PositionResolution Comments:
    Bubbles 80-20-20270