В 90х годах прошлого века было довольно много попыток внести ясность в описание и представление векторных данных в вебе. Началось это примерно в 1994-1995 годах, когда несколько независимых групп разрабатывают и предлагают сначала спецификацию, а затем и плагины к браузерам для SVF (Simple Vector Format), VRML (Virtual Reality Markup Language).
Чуть позже, 19 августа 1998 года, была представлена альтернатива для CGM (Computer Graphic Metafile) — Web CGM, — которая бы позволила расширить сферу примнения данного формата.
VRML оказался самым жизнеспособным из всех представленных аналогов (наверное, в силу поддержки в Netscape), и был сначала утвержден в рамках стандарта VRML97, а затем преобразован в X3D в 2004 году.
Sun / IBM / Adobe 10 апреля 1998 года выкатывают свое решение для представления данных в векторном формате в вебе — PGML. Microsoft тоже не дремлет и вместе с рядом крупных компаний предлагает буквально через месяц (13 мая) на рассмотрение W3C альтернативное решение — стандарт VML. Дальше Microsof гнет свою линию и включает поддержку VML уже в IE 5.0 (в марте 1999 года).
Очевидно, что технология, обладающая такой мощной поддержкой в браузерах того времени просто так не могла умереть (в отличие от PGML, которая, по-видимому, поддерживается только в настольных приложений тех компаний, которые его выдвинули). И в 2008 году VML окончательно закрепляется в качестве стандарта в составе Open Office XML.
История Canvas во многом отлична от упомянтых векторных стандартов. Во-первых, в 2005 году Apple предложила использовать уже вендренную ею технику Canvas для попиксельного изменения изображения внутри какой-то области (Canvas, холста). Эта идея была подхвачена Mozilla, которая интегрировала ее в Gecko 1.8 (Firefox 1.5 и выше), а позже и Opera (Opera 9.0 вышла с поддержкой Canvas).
Затем Canvas был включен в готовящийся стандарт Web Applications 1.0, который затем вошел в состав HTML5. Планируется, что поддержка Canvas пойдет в следующую версию IE.
На настоящий момент SVG поддерживается всеми современными браузерами. Для IE необходимо использовать эмуляцию всех методов через VML (либо создавать альтернативное приложение).
Для описания SVG используется XML формат. При этом, естественно, возможны любые преобразования получившегося изображения при помощи DOM-методов (т.е. можно использовать любую JavaScript-логику «поверх» векторных форматов).
Спектр использования векторной графики сейчас довольно широк: это отображение масштабируемых объектов, областей на картах, вывод графиков. Стоит отметить, что в силу XML-природы SVG может быть легко интегрирован с другими форматами, в частности, сейчас идет его интеграция с MathML. Также можно назвать одно «нестандартное» применение VML — для эмуляции полупрозрачности в PNG для IE. Для этого разработана специальная JavaScript-библиотека — DD_belatedPNG.
Основным отличием от SVG в Canvas является его чисто динамическая (можно использовать только при помощи JavaScript) и растровая (нет объектов и связе между ними) природа. Однако в некоторых случаях это только плюс (например, сложные области на картах было бы логичнее обводить при помощи растровой, а не векторной графики).
Для работоспособности в IE используется эмуляция с помощью VML.
Как и всякую популярную технологию, Canvas используют по поводу и без везде, где только можно. Например, для отображения в браузере произвольных шрифтов (поскольку корректная поддержка @font-face несколько запаздывает): typeface.js (к слову есть более правильное с идеологической точки зрения решение данной проблемы - cufon). Также хочется отметить пример портирование библиотеки Processing - Processing.js. Множество других примеров использования технологии можно посмотреть на www.canvasdemos.com.
Если вы собираетесь использовать точечную (пиксельную) графику, то лучше Canvas для этой цели ничего не подходит. При работе с большими (по площади) векторными объектами лучше использовать SVG. Также будет необходимо дублировать всю функциональность через VML для IE 8 и ниже.
Спасибо за внимание. Вопросы?
© 2016 ООО ВЕБО
