
Spirograph in HTML 5 - DanielRibeiro
http://codepen.io/cwolves/pen/gykbc
======
sea6ear
I find Hal Abelson's book Turtle Geometry [1] fascinating. It describes a
dialect of Logo (the graphical routines could probably be implemented
relatively easily in Python/Tkinter or Tcl/Tk or something like Processing).

Once the basics are described, then it uses them to go on to explore things
like non-euclidian geometry (and maybe topology?).

[1] [http://www.amazon.com/Turtle-Geometry-Mathematics-
Artificial...](http://www.amazon.com/Turtle-Geometry-Mathematics-Artificial-
Intelligence/dp/0262510375)

------
DanBC
I love this.

    
    
      Since I'm on an old book kick today, here's a link to an old book with similar, simpler, nice graphics.
    

([http://www.amazon.com/Mathographics-Robert-
Dixon/dp/04862663...](http://www.amazon.com/Mathographics-Robert-
Dixon/dp/0486266397/ref=sr_1_sc_1?ie=UTF8&qid=1365296957&sr=8-1-spell&keywords=mathagraphics))

------
andrewcooke
fwiw, <http://www.acooke.org/spirograph.html> \- svg + js, cerca 2005.

anyone have a java applet that still runs? :o)

[edit: the source <http://www.acooke.org/spiro.svg>]

------
alisey
Here's a similar algorithm that creates patterns slightly resembling
radiolarians:

<http://alisey.deviantart.com/art/Orbits-316110768>

<http://explord.com/experiments/orbits/>

------
jmspring
Great to see this. It reminds me of the original toy.

If I had the time/inclination, a kickstarter based on the original toy that
rendered on paper and screen might be an interesting plaything.

Another future angle could clearly involve 3d-printing of the disks.

Good stuff.

~~~
inDigiNeous
You might also want to check out <http://GeoKone.NET>, which is kinda similar,
but not trying to imitate the original spirograph. But I hear many people have
compared the two.

GeoKone is much more complex though and allows much more flexible geometry to
be created.

------
ChuckMcM
Nice! Now to hook that up to some lasers :-)

------
ISL
Any concerns with epilepsy, running at the higher speeds? Seemed like the
rendered spirograph got into the relevant frequency range.

------
ttty
Is that code formatting automatic? if yes, how did you do? (comma, variable
number of spaces, key, value)

    
    
         {
          orientation : 'vertical'
          ,   animate : true
          ,     value : 100 * radii[ ix + 1 ]
          ,     slide : onChange
          ,    change : onChange
          ,      step : .01
        }

------
Rinum
I'm always amazed at how much can be accomplished with so little code; this is
awesome!

------
billpg
How do I control the speed? Turning the "Speeds" control up or down only seem
to make it go really fast.

~~~
tete
It's slow in the middle, cause I think you are just changing the direction, by
maxing it out.

------
snifty
dear hn, html5 != chrome

~~~
ChrisClark
Works great in Firefox 19.0.2, I think that's pretty old.

~~~
fotbr
Works great in FF 3.6.24, too. Yes, I dusted off an ancient testing virtual
machine just to see if it would work.

