Steven Dutch, Professor Emeritus, Natural and Applied Sciences,Universityof
Wisconsin - Green Bay

Number of SectorsIncrease
Factor per RevolutionMinimum
Radius

A logarithmic spiral has the polar equation r=exp(ka) where r is the radius and a is the azimuth. It has the property that the curve makes a constant angle with the radius. Thus, a logarithmic spiral divided into equal radial sectors is a tesselation of geometrically similar tiles, differing only in size

Any plane tesselation has a logarithmic spiral counterpart. The radial cells formed by the spiral and its radii correspond to the unit cells or period parallelograms of the plane tesselation. Basically a point (x,y) in the plane is mapped to point (r,a) in logarithmic spiral space. However, note that this is not a one-to-one mapping. If the radius increases by q per revolution, then point (kx,y) is mapped to (qr,a). But so is point (x,y+2pi). Adjust the increase per revolution and number of sectors to get the most pleasing proportions.

In a few cases, interesting results come from using non-integral values for the number of sectors. Simple box patterns with sectors equal to an integer plus one half result in a brick pattern. Two different hexagon-triangle patterns can be created by selecting integral or integer plus one half sectors. Using integer plus 1/3 or 2/3 with the hexagon pattern results in hexagons with bow-tie polygons.

Since logarithmic spiral tesselations consist of repeated motifs that grow in size, they are common growth forms in biology (sunflower heads, sea shells, etc.).

I know of two main graphics routines for Javascript. Both are kludges. They
define tiny <Div> elements to create pixels. That's not a reflection on
their authors but solely on the ~~almost~~ criminal negligence
of the people who created JavaScript in not incorporating graphics capability.
My definition of a serious computer manual is one that devotes Chapter 1 to
the usual intro material and Chapter 2 to graphics. Anyway, the two JavaScript
graphics modules are jsDraw2D.js by jsFiction.com and wz_jsgraphics.js by the
late Walter Zorn (and perpetuated on legacy sites). jsDraw2D has some annoying
bugs that cause it to drop the ends of line segments, and drop portions of lines
and arcs that are horizontal or vertical. wz_jsgraphics has simpler format but
also the very annoying feature that ellipses are defined by the box that encloses
them rather than by centers and axes. (It's not hard to write a function to
get around that problem). Nevertheless after test-driving both I concluded Zorn's
is better because it draws complete lines and arcs.

How they come out will depend on your browser. Internet Explorer 8 in XP sometimes renders them with ugly clumps of multiple pixels but they come out just fine in Windows 7, Chrome and Firefox. But Firefox can be slow.

Since Javascript has very well-founded safeguards against writing files, you can't simply save your designs to a file. Instead, use PrintScrn to capture the screen, then copy it into your favorite drawing program, crop it and save it.

Return to Symmetry Index

Return to Professor Dutch's home page

*Created 29 November 2010, Last Update
11 June 2020*