Короткий ответ: растровое изображение состоит из точек, векторное — из линий и фигур, описанных формулами. Отсюда вся разница: растр хорошо передаёт фотографии, но портится при увеличении; вектор увеличивается без потерь, но годится только для графики с чёткими формами — логотипов, схем, шрифтов. Перевести растр в вектор можно трассировкой — этим занимается наша программа RasterTracer. Ниже — как устроены оба вида графики, какие у них форматы и когда какой нужен.
Растровая графика: изображение из точек
Растровое изображение — это сетка из крошечных цветных квадратов, пикселей. У каждого пикселя свой цвет, и на расстоянии они сливаются в картинку — так же, как мозаика складывается в портрет. Фотография с телефона — это двенадцать и более миллионов таких точек.
Главное свойство растра — фиксированный размер. Точек в файле столько, сколько записано, и взять новые неоткуда. Увеличьте картинку вдвое — программа растянет каждую точку, и края превратятся в лесенку, а мелкие детали — в размытые пятна.
Зато растр умеет то, что недоступно вектору: передавать плавные переходы цвета, тени, фактуры — всё, из чего состоит реальный мир. Поэтому фотографии, сканы и цифровая живопись — всегда растр.
Векторная графика — это описание, а не картинка
Векторное изображение хранится иначе: в файле записано не «какого цвета каждая точка», а «что нарисовать». Круг — это центр, радиус и цвет заливки. Буква — набор кривых, проходящих через заданные узлы. Когда такой файл открывают, программа заново строит картинку под нужный размер.
Поэтому векторные изображения можно увеличивать до размеров здания: кривая остаётся кривой, край — резким. По той же причине файл векторной графики обычно невелик: описание логотипа занимает килобайты, сколько бы метров он ни занимал на вывеске.
Ограничение — в природе самого способа. Векторная графика используется там, где изображение раскладывается на фигуры: логотипы, значки, шрифты, схемы, чертежи, карты, иллюстрации с плоскими цветами. Фотографию так описать нельзя: в ней нет фигур, есть миллионы оттенков.
Растровая и векторная графика: отличия в таблице
| Свойство | Растр | Вектор |
|---|---|---|
| Из чего состоит | пиксели | контуры и заливки |
| Увеличение | теряет чёткость | без потери качества |
| Размер файла | растёт с числом точек | зависит от сложности рисунка |
| Фотографии | да | нет |
| Логотипы, схемы, шрифты | можно, но хуже | да |
| Правка | по точкам: кисть, ластик | по фигурам: подвинуть, перекрасить |
| Резка, гравировка, вышивка | нет | да |
Форматы растровой и векторной графики
Вопрос «векторная графика — какой формат» решается по расширению файла, с одной оговоркой.
- Растровые форматы: JPG, PNG, GIF, BMP, TIFF, WebP, HEIC. Чем они отличаются друг от друга, сведено в сравнении форматов изображений.
- Векторные форматы: SVG — открытый, для сайтов и обмена; AI — рабочий формат Adobe Illustrator; CDR — формат CorelDRAW; EPS — старый универсальный формат полиграфии; DXF — чертежи и станки.
- Смешанные: PDF может содержать и вектор, и растр — текст и логотип в нём обычно векторные, а фотографии растровые.
Оговорка вот какая: векторный формат файла не гарантирует, что внутри вектор. В SVG, EPS и PDF можно вложить обычную картинку — снаружи файл выглядит «правильным», а при увеличении рассыпается на квадраты. Как это распознать, показано в тексте о том, как перевести JPG и PNG в SVG; о самом формате — что такое SVG.
Когда нужен вектор
- Логотип для печати и вывески. Один и тот же знак должен выглядеть чётко на визитке и на баннере. Типографии так и просят: логотип в векторе, «в кривых».
- Плоттер, лазер, станок с ЧПУ. Инструмент движется по линии, а в растре линий нет — нужен контур. Подробнее — в тексте про вектор для резки.
- Значки и графика для сайта. Векторный значок остаётся резким на экране любой плотности и весит меньше картинки.
- Схемы и чертежи, которые предстоит править и масштабировать.
А когда нужен растр, вопроса обычно не возникает: всё снятое камерой или сканером уже растровое.
Как перевести одно в другое
Из вектора в растр — просто и без потерь смысла. Любой векторный редактор экспортирует картинку в PNG или JPG нужного размера; операция называется растеризацией. Обратно из такой картинки исходные фигуры уже не достать.
Из растра в вектор — сложнее. Программа должна найти на картинке границы цветов и провести по ним кривые; это трассировка, или векторизация. С логотипом и рисунком тушью она справляется хорошо, со сканом документа — приемлемо, а фотография превращается в постер из цветных пятен. Способы, порядок действий и чего ждать от результата — в основном тексте: как перевести картинку из растра в вектор.
Коротко для запоминания
- Растр — точки; вектор — формулы.
- Растр — для фотографий; вектор — для логотипов, схем и шрифтов.
- Растр при увеличении теряет чёткость; вектор — нет.
- Вектор в растр переводится легко; растр в вектор — трассировкой и не для всякой картинки.