Недавно у меня была возможность попробовать Raphaël , решение на основе SVG, и Flot , решение на основе холста. Оба обеспечивают эмуляцию в браузерах, которые не поддерживают основной формат: Raphaël использует VML в IE, а Flot использует excanvas .
Как SVG, так и canvas имеют свои преимущества и недостатки. Оба могут рисовать фигуры, контуры и встраивать изображения, но canvas может выполнять манипуляции на уровне пикселей и быстро рисовать намного больше спрайтов, поэтому он становится популярным для игр HTML5. У SVG более мощные пути, хотя вам придется изучать синтаксис.
У SVG есть еще одно действительно интересное преимущество: элементы на диаграмме являются узлами DOM, поэтому он может использовать события мыши и щелчка в браузере, а также добавлять, удалять или изменять отдельный узел без перерисовки всей диаграммы. Чтобы сделать то же самое на холсте, необходимо вручную отслеживать местоположение каждого визуального элемента и перерисовывать весь холст при перемещении материала. (Canvas позволяет выполнять двойную буферизацию и кеширование, так что можно быстро перерисовать его, но логика отслеживания того, где все находится, остается на вас.)
По этой причине я думаю, что SVG - лучший выбор для интерактивных графиков и диаграмм, тогда как холст больше подходит для продвинутой графики. В любом случае кросс-платформенная совместимость является проблемой, и указывается уровень абстракции.