Я должен был сделать нечто подобное 3 года назад, чтобы представить BPM .Я реализовал это с помощью <canvas> (я построил библиотеку поверх обоих canvas и VML - для IE -), и я выбрал второй предложенный вами вариант.
Проблема с canvas заключается в том, что если у вас многовзаимодействий (нажмите на конкретный элемент, переместите его и т. д.), а затем каждый раз, когда вам нужно перекрасить все (и это, для большого холста, полного элементов, не является лучшим с точки зрения производительности).Я предпочел представлять X-заполнители (каждый заполнитель - это div, содержащий холст), и я заметил, что производительность была лучше, и, очевидно, DOM-событиями (прикрепленными к контейнеру canvas) было намного проще управлять.такого рода интерактивные вещи можно использовать с помощью SVG (и сейчас я бы предпочел это), например, raphaelJS .Для анимации и двумерного представления без взаимодействия я бы использовал <canvas>.