By DesertDawg
Friday, 26. January 2007, 13:30:05
Drawing Hilbert curves with SVG
Images and animations starts with drawing a path. This article shows to use a particular type of mathematical curves to create patterns that are both visually attractive and useful.
( Read the article )
By Darken
Friday, 2. February 2007, 01:14:47

Interesting
By jax
Friday, 9. February 2007, 17:56:59

What I missed from the article was a description for non-matematicians how actually generate the path point based on this type of curve. Can you elucidate?
By DesertDawg
Friday, 9. February 2007, 23:19:36

The trick is to use the blue graph (400 by 400) as a guide and hand draw each little line segment to form the "basic design." No math involved.
Look at the source code. There are 4 polylines: a, b, c, d. Polyline "a" (red) was formed by points='25 175,75 175,75 125,25 125,25 25,75 25,75 75,125 75,125 25,175 25,175 125,125 125,125 175,200 175'
The red "basic design" has as its starting point x=25 and y=175. The blue graph is made up of little squares 50 by 50. So the next point is x=75 and y=175 on the graph. Zero on the graph is the upper left hand corner.