Между SVG и canvas, что лучше подходит для манипулирования / анимации нескольких изображений? Может быть, нет и просто использовать преобразования CSS3?

Question

Вторая часть вопроса: с какой библиотекой javascript лучше / проще работать с изображениями?Я не буду рисовать какие-либо формы или что-то еще.Другая информация: я буду использовать jQuery, и мне не нужно будет поддерживать все браузеры, только webkit.

Редактировать: Больше информации: текущий дизайн предназначен для разметки / рисования нескольких строк /столбцы изображений в виде сетки, с изображением в центре, находящимся в «фокусе» (чуть больше, с рамкой или чем-то и рядом с ней текст).Хитрость заключается в том, что мы хотим, чтобы весь холст изображений скользил / скользил, чтобы сфокусировать другое случайное изображение.Таким образом, очевидно, что количество изображений в этой сетке должно превышать то, что видно в окне просмотра, поэтому при переходе всегда присутствуют изображения, занимающие холст.Кроме перемещения изображений, я не буду размывать их или иным образом изменять их.В конце концов мы добавим взаимодействия с пользователем, такие как нажатие / касание на видимом изображении, чтобы вручную сфокусировать его.

Дайте мне знать, если это не ясно или все еще сбивает с толку.

Я столкнулся с scripty2 , который кажется альтернативой использованию canvas / SVG для моих целей.Я также начал пердеть с EaselJS прошлой ночью, и кажется, что это может сработать, но мне интересно, окажется ли это в итоге более трудоемким, чем просто использование стандартного HTML / CSS и инструментакак Scripty2, чтобы помочь с анимацией и событиями click / touch.Просто ищу любые предложения.Спасибо!

Answer 1

Ответ зависит от ваших манипуляций и анимации.

Если это просто переводы, CSS выигрывает по скорости по сравнению с canvas.Я не проверял, но я уверен, что он легко превосходит SVG для такого же рода вещей.

Если вы собираетесь делать неаффинные преобразования или иным образом связываться с изображениями (например, размывать их)вам явно нужен Canvas.

Если вам нужны обработчики событий для каждого объекта, вам явно нужна система рисования с сохранением режима, такая как SVG или HTML + CSS.Я не сделал достаточно CSS3-преобразований, чтобы сказать, как они сравниваются по скорости с SVG, но у них явно нет надежного преобразования DOM SVG.

Это довольно субъективновопрос (или набор вопросов), и вы еще не предоставили достаточно информации для четкого ответа.