Я делал грубо говоря то же самое с помощью raphaeljs.com/ (это SVG). В Illustrator'е делал нужные шейпы, экспортировал в SVG. А Raphael'ем отрисовывал. Прекрасно поддерживаются события, в т.ч. клик, ховер. Если хотите, я даже могу вам отправить, что у меня получилось.
С помощью canvasэто тоже можно сделать.
imagemap я бы не использовал. Слишком сложные формы у областей, слишком трудоемко.
pouchdb.com/
PouchDB is a JavaScript library that allows you to store and query data for web applications that need to work offline, and sync with an online database when you are online.
Вешайте обработчики на контролы сразу. Создайте массив аля flow / steps / stack. А дальше как вариант — контролу присваиваете индекс (или шаг), а обработчик проверяет, если индекс контрола совпадает с текущем на стеке — проверяем и если правильно добавляем в стек, и тем самым переходом на след. индекс/шаг.