HTML5 элемент холста и svg - PullRequest
24 голосов
/ 30 октября 2009

Зачем нам нужен элемент холста html5, когда этого можно добиться с помощью встроенного svg?

Ответы [ 8 ]

35 голосов
/ 30 октября 2009

SVG и canvas не являются взаимозаменяемыми технологиями. SVG - это тип графики с сохранением режима, когда все рисуется из довольно абстрактной модели (документ SVG). Canvas, с другой стороны, является своего рода графикой непосредственного режима, где нет модели, а клиент (JavaScript) должен позаботиться о перерисовке, анимации и т. Д.

17 голосов
/ 31 октября 2009

SVG является языком разметки для векторной графики и имеет DOM. Это позволяет очень легко изменять контент после его создания.

Canvas - это поверхность для рисования, как и MS Paint без кнопки отмены. Вы не можете изменить содержание. Вы можете только перекрасить его. Это очень удобно, потому что браузеру не нужно обрабатывать полный DOM для изображения. И есть вероятность, что Canvas сможет обрабатывать 3D-рисунки в будущем.

6 голосов
/ 31 октября 2009

http://people.mozilla.com/~vladimir/xtech2006/ имеет хорошее сравнение.

С canvas вы не должны иметь дело с DOM, что приводит к более быстрому и простому написанию кода. SVG тоже беспорядок как спецификация ...

3 голосов
/ 05 декабря 2009

иллюстрация: мой движок блога (блоггер) не поддерживает SVG (это не документ XHTML). Я написал инструмент для преобразования SVG в элемент canvas: http://plindenbaum.blogspot.com/2009/11/tool-converting-svg-to-canvas_22.html

1 голос
/ 13 июня 2012

Вы также можете найти это сравнение полезным: http://dev.opera.com/articles/view/svg-or-canvas-choosing-between-the-two/

1 голос
/ 05 ноября 2010

Вот объяснение того, как разобрать простой svg и нарисовать его на холсте ..

http://www.ikeralbeniz.net/2010/11/03/jugando-con-html5-canvas-y-svg-i/ http://www.ikeralbeniz.net/2010/11/04/jugando-con-html5-canvas-y-svg-ii/

в следующих сообщениях парсер svg будет дополнен прозрачностью и градиентами

0 голосов
/ 19 июля 2013

Это не совсем технический ответ, но я думаю, что это правильный ответ.

Суть в том, что нам не нужны оба. Да, я знаю, что есть различия между векторной и растровой графикой и разные способы управления путями, объектами, анимацией и т. Д. Между ними, но для конечного пользователя все одинаково. Да, SVG сейчас немного мощнее из-за его более длительного существования, но немного больше работы позволяет делать то же самое с Canvas.

Я полагаю, что реальность такова, что Canvas является частью подавляющей реакции на сам XML в веб-разработке. Я полагаю, что большинство веб-разработчиков, особенно те, которые работают с ограниченным временем и ресурсами вне «корпоративных» сред, не любят сложность XML. Canvas является частью набора предпочтительных технологий «просто делай одно», так же как HTML5 предпочтительнее XHTML, JSON предпочтительнее XML и даже YAML предпочтительнее XML.

Я думаю, что идея похожа на философию * nix, согласно которой многие конкретные инструменты выполняют одну вещь правильно и эффективно, а не один мегаинструмент, выполняющий много вещей. (Это также похоже на философию, которой придерживаются многие велосипедисты с фиксированной передачей, которые избегают невероятно точных и продвинутых технологий переключателя ради простоты одного механизма прямого привода.)

Не поймите меня неправильно, я считаю, что XML - это невероятно мощная и блестящая технология, придуманная и разработанная блестящими людьми для того, чтобы стать главным швейцарским ножом в сети, программировании, настройке, хранении данных и т. Д .; но это не значит, что проще управлять и стилизовать серию сложных контуров, чем просто рисовать пиксели на.

Я знаю, что мой ответ самоуверенный, и я не собираюсь это считать пламенем. Мне нравится SVG, и я бы хотел, чтобы за эти годы он получил больше поддержки (особенно от IE), но я чувствую, что волна поворачивает к Canvas просто из-за психологии разработчиков стандартов и веб-разработчиков, которые на них влияют.

В долгосрочной перспективе я хотел бы, чтобы SVG сделал XML необязательным и перешел к более JSON-подобной структуре, которой проще манипулировать с помощью JavaScript, возможно, даже ставшей контекстом Canvas на векторной основе. На мой взгляд, это было бы лучшим решением для Интернета.

0 голосов
/ 30 октября 2009

Потому что тогда нам не нужно беспокоиться о том, что поддерживает такое встраивание; -)

Таким образом, основной задачей разработчиков приложений является соблюдение стандартов и предоставление возможности дизайнерам-клиентам делать то же самое. и, следовательно, избавить всех от беспокойства о плагинах, версиях, настройках безопасности и т. д. *

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...