2012-03-11 8 views
6

Мне было интересно, лучше ли сделать анимацию, как this в холсте или svg (исполнение мудрым)? Я переписываю его сейчас в jquery, но где-то я читал, что холст перерисовывается каждый раз, когда он изменяется.Анимация SVG или Холст?

ответ

9

Для этих «простых» анимаций и графиков сцены на самом деле не имеет значения, используете ли вы качество SVG или Canvas. Оба должны работать нормально без проблем с производительностью.

Однако было бы проще создать анимацию с SVG по сравнению с Canvas. В Canvas вы должны перерисовать всю сцену, а в SVG вы можете просто создать кольцо один раз, а затем определить преобразование (поворот) на нем.

Для SVG проверить d3.js или raphael и холста Вы можете проверить processingjs, fabric.js, kinetic.js или paper.js

+0

Когда вы рисуете круг или что-то в полотне, можно добавить событие к нему в холст? И с SVG? Приятные примеры, которые вы отправили :) – BigChief

+3

Ну в чистом холсте невозможно присоединить события к любым примитивам/фигурам. Вы должны написать код для обнаружения попадания (проверьте, находится ли позиция мыши внутри круга). Однако вышеупомянутые библиотеки холстов могут поддерживать события на фигурах, поскольку они обычно имеют уровень абстракции. SVG поддерживает события на фигурах из коробки, и именно поэтому взаимодействие также проще реализовать в SVG, чем в Canvas. –

+0

Хорошо, я думаю, что я собираюсь использовать холст с одной из библиотек для добавления событий. – BigChief