Dev.Opera - Follow the standards, break the rulesDev.Opera - Follow the standards, break the rules

Login

Lost password?

Forums » Article Discussions

Discuss the articles posted at DevOpera

Note: You need to login to post in the forums. if you don't have an account you first need to sign up.

By DesertDawg anchor 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 anchor Friday, 2. February 2007, 01:14:47

avatarInteresting

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

avatarWhat 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 anchor Friday, 9. February 2007, 23:19:36

avatarThe 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.

Moderators: jax | malware | mcx | operadev