SVG

Посмотрим как работать с иллюстрациями в формате SVG. Во-первых, это формат векторной а не растровой (попиксельной) графики. Т.е. не нужно его использовать для представления живописного портрета Эйлера. Он только для рисунков, графиков, всего, что рисуется преподавателем на доске. Во-вторых, в svg-файлах находится обычный текст, который можно открывать и корректировать даже в «блокноте» MS Windows.

Теперь по сути текста внутри файла. Там всего несколько очевидных типов команд, задающих фигуры (shapes). Например, Rectangle (прямоугольник), Circle (окружность — можно обойтись эллипсом), Ellipse (эллипс), Line (отрезок) и т.п. Конечно придется потратить минуту, чтобы вникнуть в детали. Например понять чем отличается SVG Polygon от SVG Polyline. Это совсем не сложно, но это полезный опыт. И не забудьте посмотреть SVG Text если нужно вводить подписи.

Где об этом читать? Если Вы уже просмотрели первую ссылку на русскую википедию, то Вам понадобится только эта документация. И не пугайтесь английского языка, и не ищите чего-то другого. Здесь все просто, понятно и правильно. Я гарантирую, что Вашего владения языком достаточно, чтобы читать и понимать. Если я все же ошибаюсь, то translate.google.com Вам в помощь.

Как начать кодировать SVG графику? Вот почти игрушечный, но очень полезный ресурс. Просто пишем слева текст описания картинки на SVG, жмем кнопку submit в центре и справа видим как это выглядит. Остается только сохранить тег <svg> в текстовый файл с расширением .svg. Да, желательно еще добавить первую строку в виде <?xml version="1.0" encoding="UTF-8" ?>. Кстати, В окне слева можно экспериментировать и с текстом на HTML. К сожалению wordpress не позволяет включать напрямую код SVG в текст записи — все «опасные» теги, в том числе и <svg> он фильтрует и выбрасывает. Если у меня будет время, я напишу длинную-предлинную строку допустимых внешних тегов вида svg[xmlns|version], circle[cx|cy|r|stroke|fill], … Тогда это можно будет делать. А пока работаем, как с обычным медиафайлом.

Если разбираться с форматом SVG Вам лень, то Вы не туда пошли учиться можно попробовать один из онлайн редакторов. Однако следует учесть, что я буду проверять исходный код. Т.е. то безумие, которые пишут в код графические редакторы нужно удалить и разобраться в оставшемся. В качестве простых векторных редакторов могу порекомендовать InkScape или SVG-Edit. Редактор написан на JavaScript и доступен в исходных кодах на странице проекта. Кстати, информация на будущее, при работе над курсовыми и дипломными работами Вы можете присоединяться к существующим командам различных проектов Open Source. Обычно это поощряется преподавателями и дает полезный опыт Вам.

SVG: 2 комментария

  1. Пишу здесь, чтобы не забыть. Нужно дать кому-то на 3-м курсе разработку плагина WordPress со встроенным SVG редактором и модификацией фильтра контента. И легко и полезно.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *