SVG snap-to-grid, part two


I spent another six hours on this, and I’m fairly pleased with the results. The bulk of the code is now in a new SnapGrid.js library file. The features:

  • Keyboard- and mouse-driven commands
  • Step-by-step defining of an object (in this case, a line)
  • A semi-generic, objects-within-objects library design. (Doing it right is much harder than it looks, and I’m pretty sure I’m not doing it right!)
  • Of course, a nice big grid, and a nice big dot showing you where the snap-to-grid will snap to.

It’s another proof-of-concept, but this time for something much smaller than Verbosio. Hopefully, if I’ve designed it right, I can rapidly expand it to cover other shapes and, more importantly, the SVG path element…