Кодирование графической информации

Как кодируется изображение

Кодирование графической информации — это представление рисунка в виде чисел, понятных компьютеру. Существует два основных способа представления изображений: растровый и векторный.

Растровое изображение

Растровый рисунок состоит из мельчайших точек — пикселей, выстроенных в прямоугольную сетку. Каждый пиксель имеет свой цвет, закодированный числом. Чем больше пикселей, тем выше детализация и тем больше объём файла. При сильном увеличении растровая картинка распадается на квадратики — это её главный недостаток.

Глубина цвета — это количество бит, отведённое на код цвета одного пикселя. Число доступных цветов вычисляется по формуле:

N = 2 ^ i

где i — глубина цвета в битах, N — количество цветов в палитре.

Векторное изображение

Векторный рисунок описывается не точками, а математическими объектами: отрезками, дугами, окружностями, заливками. Хранятся координаты и параметры этих фигур. Такое изображение можно увеличивать без потери качества, а его объём обычно меньше. Векторная графика удобна для чертежей, схем и шрифтов, но плохо подходит для фотографий, где цвета меняются плавно и сложно.

Модели цвета

Цвет каждого пикселя на экране задаётся смешением трёх основных цветов: красного, зелёного и синего. Эту модель называют RGB (по первым буквам английских названий цветов). Яркость каждой составляющей кодируется отдельным числом, чаще всего от 0 до 255. Сочетание трёх таких чисел и определяет итоговый оттенок пикселя. Если на каждый из трёх цветов отвести по 8 бит, общая глубина цвета составит 24 бита — это режим истинного цвета.

Для печати на бумаге используют другую модель — CMYK, где цвет получается смешением голубой, пурпурной, жёлтой и чёрной красок. Экранная и печатная модели описывают один и тот же рисунок разными способами.

Подсчёт объёма растрового изображения

Объём растрового рисунка равен числу пикселей, умноженному на глубину цвета:

I = K * i, где K — количество пикселей, i — глубина цвета.

Пример. Изображение размером 100 на 200 пикселей с глубиной цвета 8 бит.
K = 100 * 200 = 20000 пикселей
I = 20000 * 8 = 160000 бит = 20000 байт ≈ 19,5 Кбайт

Частые ошибки. Считают размер только по одной стороне, забывая перемножить ширину и высоту. Путают глубину цвета и число цветов: они связаны формулой N = 2 ^ i. Не переводят биты в байты при ответе.

Индексная палитра: пиксель хранит номер цвета

При прямом RGB-кодировании пиксель содержит компоненты цвета. При индексном кодировании он хранит номер записи в отдельной палитре. Например, номер 2 может обозначать синий цвет, если так записано в таблице. Сам номер без палитры не определяет RGB.

Для N цветов при одинаковой длине кодов нужен минимальный целый i, удовлетворяющий 2ⁱ ≥ N. Поэтому для 20 цветов нужно 5 бит, хотя часть из 32 возможных кодов останется неиспользованной. Формула N = 2ⁱ показывает ёмкость кодирования, а не обязательное фактическое число цветов рисунка.

Оригинальный расчёт с учётом палитры

Растр 80 × 60 пикселей использует 16 цветов. В учебной модели без сжатия, заголовков и выравнивания каждый индекс занимает 4 бита: 80·60·4 = 19 200 бит = 2400 байт. Если каждая запись палитры содержит три байта RGB, сама палитра занимает 16·3 = 48 байт. Итого индексы и палитра — 2448 байт.

Прямое RGB-кодирование с 24 битами на пиксель заняло бы 80·60·3 = 14 400 байт без служебных данных. Сравнение относится к указанной модели; размер реального PNG или другого файла зависит также от сжатия и структуры формата.

Как не потерять качество

Если изображение уже использует не более 16 выбранных цветов, индексное представление может сохранить их точно. Если фотографию с большим числом оттенков принудительно свести к 16 цветам, часть цветов придётся заменить: сама смена представления не гарантирует отсутствие потерь.

Проверка: код 1111₂ в четырёхбитной палитре означает индекс 15, то есть шестнадцатую запись при нумерации с нуля. Не ищите «запись 16». В реальном формате способ упаковки индексов задаётся его спецификацией; нельзя автоматически округлять каждый четырёхбитный индекс до отдельного байта.

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

Первоисточники: W3C: индексная палитра PNG.

Кратко о главном

• Растровое изображение — сетка пикселей; векторное — набор математических фигур.
• Глубина цвета — число бит на пиксель; число цветов N = 2 ^ i.
• Объём растра: I = K * i, где K — общее число пикселей.
• Векторная графика масштабируется без потери качества, растровая — нет.