HTML5 Canvas Векторная графика?

Question

Скажите, пожалуйста, какие библиотеки для рисования и обработки векторной графики в HTML5 Canvas вы знаете?

спасибо !!!

Answer 1

Есть несколько вариантов. Я не использовал ни одну из этих библиотек, но из того, что я могу сказать, Cake кажется более впечатляющим и импортированным, а также в три раза больше. Существует также Burst Engine, в настоящее время расширение processing.js, которое еще меньше. Я уверен, что есть еще несколько.

Processing.js

"Processing.js сестра проект популярной обработки языка визуального программирования ..."

Размер: 412 KB

Raphael

«Рафаель небольшой JavaScript-библиотека, которая должна упростить вашу работу с векторной графикой в ​​Интернете. Если вы хотите, например, создать свою собственную диаграмму или изображение и повернуть виджет, вы можете достичь этого просто d легко с этой библиотекой. Raphaël использует Рекомендацию SVG W3C и VML в качестве основы для создания графики. Это означает, что каждый созданный вами графический объект также является объектом DOM, поэтому вы можете присоединить обработчики событий JavaScript или изменить их позже. Целью Raphael является обеспечение адаптера, который сделает рисунок векторной графики, совместимый кросс-браузер и легко «

Размер:.. 60 KB

Snap.svg

Преемник Рафаэле Автор тем же разработчиком, но предназначенные только для современных браузеров.

«Snap предоставляет веб-разработчикам чистый, обтекаемый, интуитивно понятный и мощный API для анимации и управления как существующим SVG-контентом, так и SVG-содержимым, созданным с помощью Snap.

Предоставляя простой и интуитивно понятный JavaScript API для анимации, привязки может помочь сделать содержание SVG более интерактивным и интересным "

Размер: 66 KB

Cake

". ТОРТ является дерева сцены библиотека тега canvas. Можно сказать, что это как SVG SANs XML, и не слишком далеко от «

Размер: 212 KB

Paper.js

». Paper.js является основой векторной графики сценариев с открытым исходным кодом, который работает на вверху холста HTML5. "

Размер: 627.91 КБ

The Burst Engine

«Всплеск Двигатель анимации двигатель OpenSource вектора для элемента HTML5 Canvas. Выброс предоставляет аналогичный веб-функциональность для Flash, и содержит систему анимации слоя на основе, как After Effects. Выброс использует очень легкий что означает, что ваши анимации будут загружаться незаметно быстро и могут управляться с помощью очень простых команд JavaScript, позволяющих цепочки и обратные вызовы ... В настоящее время Burst является расширением превосходного порта анимации Processing.js от Джона Ресига. независимый механизм Burst Engine - это сокращение времени загрузки и использования памяти, если вы хотите использовать Burst без использования jQuery или Processing.js.

ПРИМЕЧАНИЕ. Будущие версии Burst также будут запускаться как приложения для собственной обработки, позволяющие запускать анимацию Burst в апплете Java или в виде двоичного исполняемого файла ».

Это также кажется, что это был последний раз обновлялся в 2010

Размер: 52,6 KB

drawing directly to the canvas with .context

Это не внешняя библиотека, но рисунок непосредственно на холст через JavaScript.

Answer 2

http://raphaeljs.com/ хорошо работает с SVG

Answer 3

http://glimr.rubyforge.org/cake/canvas.html (cakejs)

Answer 4

http://paperjs.org/ было анонсировано недавно. Это потрясающе.

Answer 5

http://canvimation.github.com/ - это приложение с открытым исходным кодом, которое позволяет рисовать графику на экране и экспортировать результаты в виде веб-страницы, используя теги canvas и контекстные команды для воспроизведения чертежа. Есть анимация. Он находится в стадии разработки. Также доступны страницы справки.