Rewriting my grid parts page #

If you've followed my work you know I'm a fan of grids. I had a page I wrote in 2006 that I decided to update. Those were the days before html5, and even before SVG was reliable in browsers, so I had made images using some Ruby code to generate SVG, and then ImageMagick to turn SVG into PNG. If I'm going to update this page, what might I want? I made a list of possibilities:

  1. Change of focus. The old page spends a lot of time talking about the properties of grids in the abstract, and how different grid types relate to each other. When I visit the page for my own needs, I don't care about that. What I do want to see is the formulas. I use this page as a reference. I want to change it to make the formulas the main focus of the page.
  2. Interactivity. I could make all the diagrams interactive. That's what people expect from me, after all!
  3. High resolution diagrams. We're not living with 800⨉600 desktop monitors anymore. With "HiDPI" screens including 4K, I wanted to use SVG everywhere so that the diagrams are sharp.
  4. Put coordinates into the diagrams instead of only off on the side.
  5. Make the relationship diagrams for all three grid types. On the original page I have diagrams only for squares.
  6. Animations showing how square grids relate to triangle and hexagon grids.
  7. Animation showing how square grids relate to isometric grids (which are really isometric views of a square grid).
  8. More algorithms including distances, to screen coordinates, from screen coordinates.
  9. Sample code generation, so that you could select a programming language and see sample code in your favorite language.