Программирование PC О растровых изображениях для новичков Mon, November 20 2017  

Поделиться

нашли опечатку?

Пожалуйста, сообщите об этом - просто выделите ошибочное слово или фразу и нажмите Shift Enter.


О растровых изображениях для новичков Печать
Добавил(а) microsin   

В этом документе приведено элементарное введение в принципы хранения картинок (растровые изображения, bitmap) и их отображения, как это используется в компьютерной графике (перевод [1]).

Растр (bitmap, дословный перевод этого термина "поле бит", или "карта бит") определен как равномерный, прямоугольный набор ячеек, которые называются пикселами (pixel, переводится как "точка"). Обычно каждый пиксел хранит информацию о цвете точки, но понятие "цвет" трактуется более широко - например, цвет может быть монохромным (monochrome, т. е. только 2 цвета - черный и белый, 0 и 1), или с градациями серого (grayscale). В сущности, чтобы полностью сохранить данные картинки, нужно знать только количество точек (оно зависит от размера сторон прямоугольного поля бит N и M) и информацию содержимому каждого пикселя (его глубину цвета, colour depth). Именно в таком виде картинки хранятся в памяти компьютера, когда они выводятся на устройство отображения (экран), однако к этим двум фундаментальным параметрам также могут добавляться другие дополнительные данные.

definitionfig1

Обратите внимание, что карта бит bitmap всегда ориентирована горизонтально и вертикально. Пикселы считают маленькими квадратиками, хотя на практике они могут иметь другое реальное физическое соотношение сторон (aspect ratio).

Чаще всего bitmap-ы используются для представления картинок в компьютерах. Например, картинка, показанная ниже, имеет 397 пикселя по горизонтали 294 пикселя по вертикали, и каждый пиксель содержит значение уровня серого, которое может быть для каждой точки 256 различных оттенков.

definitionfig2

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

Рассмотрим эти самые популярные форматы для передачи растровой картинки.

Формат 1 bit (black and white). Это самый компактный из всех возможных вариантов представления графической информации для каждого пикселя. Результирующая картинка получается монохромной, или черно-белой (точка может иметь либо черный цвет, либо белый, других вариантов нет). Пикселы, бит которых равен лог. 0, считаются черными, и пикселы, бит которых равен лог. 1, считаются белыми. Обратите внимание, что хотя есть только 2 возможных состояния для каждой точки, на практике на этапе отображения обычно есть возможность привязки к этим двум состояниям двух цветов, т. е. 0 соответствует одному цвету, и 1 другому цвету.

8 бит серого (8 bit grayscale). В этом случае каждый пиксел получает в соответствие 1 байт (8 бит) места в памяти, благодаря чему можно закодировать 28 = 256 различных состояний точки. Если эти состояния отображены на палитру уровней серого, то получится черно-белая картинка с 256 градациями яркости (greyscale image). Принято, что 0 обычно соответствует максимально черному цвету, и 255 максимально белому. Остальные уровни серого будут линейно по яркости соответствовать промежуточным уровням кодирования, т. е., к примеру, уровень 127 будет соответствовать примерно средней яркости, 50% по яркости от уровня максимума белого.

colourdepthfig1

В любом частном приложении диапазон уровней серого может быть привязан к произвольным уровням яркости или даже цвета, т. е. уровни 0-255 могут быть преобразованы некоторыми программами в уровни 0-1, но большинство программ преобразуют уровни 0-255 к уровням 0-65535 (в качестве примера см. спецификацию системы цветового кодирования Apple).

24 bit RGB. Это следующий шаг от кодирования 8 bit grey, теперь по 8 бит выделено каждому из компонентов цвета red (красный), green (зеленый) и blue (синий). В каждой компоненте уровень 0 соответствует отсутствию этого цвета, и 255 соответствует полному насыщению цвета. Поскольку каждый компонент дает 256 различных состояний, то всего можно закодировать 224 = 28 * 28 * 28 = 256 * 256 * 256 = 16777216 возможных цветов.

colourdepthfig2

Идея цветового пространства RGB является фундаментальной концепцией компьютерной графии. В пространстве RGB любой цвет представлен точкой внутри куба с перпендикулярными осями r,g,b.

colourdepthfig3

Обратите внимание, что что уровни серого формируют прямую линию от черного до белого, составляя диагональ куба r = g = b.

8 bit indexed colour. Индексированный цвет - более экономичный способ сохранять цветные растровые изображения без использования 3 байт на точку. Как и для формата градаций серого 8 бит, на точку здесь приходится 1 байт, но только теперь значение этого байта указывает на значение цвета в таблице RGB (см. рисунок ниже). Такая таблица называется палитрой. Поскольку значение байта указывает на цвет в палитре как индекс в таблице, то такой формат называют еще формат с индексированными цветами.

colourdepthfig4

Есть некоторое количество интересных атрибутов в такой системе с индексированными цветами. Если в картинке меньше 256 цветов, то она будет иметь такое же качество, как и 24 bit bitmap, однако будет занимать место в 3 раза меньше. Интересующие цвета и эффекты анимации могут быть достигнуты простым изменением палитры, это немедленно повлияет на внешний вид картинки.

Обычно для уменьшения большой картинки 24 bit bitmap применяют её преобразование в формат с индексированными цветами и оптимизированной палитрой. Оптимизированная палитра позволяет лучше всего воспроизвести цвета, которые присутствуют в оригинальном растре bitmap.

4 bit indexed colour. Принцип здесь тот же самый, что и в формате с индексированным цветом 8 бит, то только теперь точка кодируется не 8 битами, а 4-мя, т. е. для индекса в таблице используется только половина байта. Это позволяет поддерживать таблицу из 16 цветов.

colourdepthfig5

32 bit RGB. Здесь принцип хранения картинки тот же самый, что и в цветном формате 24 бита, но еще добавляется 1 байт канала альфа (alpha channel). Этот канал может быть использован для маскирования областей картинки, или для представления прозрачности.

colourdepthfig6

16 bit RGB. Здесь на каждый цвет приходится по 5 бит, и 1 бит остается на канал альфа (см. рисунок ниже).

colourdepthfig7

[Что такое разрешение картинки (Resolution)]

Разрешение это атрибут картинки, который нужен для визуального отображения картинки или вывода на печать, поскольку у самих точек нет никакой информации о их физическом размере. Разрешение как раз дает такую привязку к физическим размерам, и обычно указывается в количестве пикселов на дюйм (dots per inch, или сокращенно DPI). На устройствах с прямоугольными пикселами разрешение может быть указано двумя числами, с указанием горизонтального и вертикального разрешения.

Концепция разрешения не зависит от информационного содержания растра bitmap, и становится важной только при переносе растра на физические объекты (экран монитора или лист бумаги принтера). Это особенно важно, когда количество точек по горизонтали и вертикали исходного растра не соответствует количеству точек конечного устройства вывода. Качество печати будет зависеть от установленного разрешения картинки. Поскольку разрешение определяет физический размер точки, то разрешение может также использоваться для изменения размера картинки при выводе изображения.

В качестве примера рассмотрим одну картинку bitmap размером в 200 точек по горизонтали и 100 по вертикали. Если этот растр будет напечатан с разрешением 100DPI, то он получит размер 2 дюйма по горизонтали и 1 дюйм по вертикали. Но если ту же самую картинку распечатать с разрешением 200 DPI, то она будет размером всего лишь 1 дюйм по горизонтали и полдюйма по вертикали.

resolutionfig1

Всякий раз, когда растр bitmap отображается на мониторе компьютера, необходимо учитывать разрешение картинки. Многие мониторы могут иметь разрешение от 60DPI (низкое качество) до 120DPI (высокое качество) и более. Точно так же, как и при выводе на печать, чем выше разрешение картинки, тем она будет выглядеть меньше по размеру на экране монитора - из-за того, что размер каждого пиксела будет меньше.

На следующем примере можно увидеть две картинки с одинаковым содержанием растра bitmap, но с разным разрешением (с разным размером точки). Картинка меньшего размера имеет разрешение 80DPI, и большая картинка имеет разрешение 30DPI. В увеличенной версии картинки отдельные пиксели намного заметнее.

resolutionfig2

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

[Преобразование глубины цвета]

Часто нужно отобразить растр bitmap с одной глубиной цвета на устройстве, которое имеет другие возможности по параметру глубины цвета. Конечно, если у конечного устройства можно вывести больше цветов, чем есть на картинке bitmap, то растр может быть отображен наилучшим образом. В обратной ситуации, когда у устройства назначения глубина цвета отличается в худшую сторону (количество отображаемых цветов меньше, чем количество цветов растра), то картинку следует преобразовать во что-то, что будет лучше выглядеть на экране монитора.

В качестве примера рассмотрим отображение картинок с градациями серого на монохромных (где есть только черный и белый цвет точки) устройствах. Это обычная ситуация для устройств на микроконтроллерах с экраном ЖКИ. Оттенки серого можно передать путем изменения количества черных и белых точек в зависимости от уровня серого. Особенно такой способ передачи градаций хорошо подходит для случая, когда у устройства вывода разрешение превышает разрешение картинки - это позволяет создать апроксимацию градаций серого каждой точки растра с помощью разного количества точек конечного устройства.

Предположим, растр bitmap 75DPI нужно отобразить на черно-белом лазерном принтере с разрешающей способностью 300DPI. В таком случае каждую точку картинки можно представить матрицей 4x4 черных и белых точек принтера, и таким способом передать яркость точки картинки.

colourconfig1

Есть несколько разных техник для получения такого соответствия матриц точек яркости точки оригинальной картинки. Одна из таких техник называется дизеринг (dithering, дословный перевод "размывание"). Даже для дизеринга есть несколько возможных алгоритмов для получения матриц пикселей для разных уровней яркости. На картинке ниже показана диаграмма смены уровней яркости и (вертикальная полоса слева) и два варианта черно-белого дизеринга - скорректированного увеличения по образцу (greatly enlarged using pattern) и размытие с диффузией (diffusion dithering).

colourconfig2

Как уже упоминалось, есть разные техники для отображения растра большой глубины цвета с малым разрешением на устройствах с малой глубиной цвета и большим разрешением. Еще одна такая техника в полиграфии называется screening. Мы не будем подробно рассматривать здесь эту технику, скажем только, что уровни серого здесь представлены объектами разного размера, чем серее точка, тем больше размер объекта (площадь объекта на точке пропорциональна уровню серого точки). Объекты выровнены по равномерной матрице под некоторым углом к горизонтали. Наиболее часто используются объекты в виде точек, черточек и прямоугольников. Ниже показан пример техники скрининга для представления градаций серого.

colourconfig3

Мы рассмотрели преобразование глубины цвета только для картинок с градациями серого (greyscale). Преобразование цветных картинок с высокой глубиной цвета в малую использует тот же самый принцип, отличие только в том, что процедура конверсии накладывается на основные компоненты цвета, на каждый по отдельности. Например, для RGB делается дизеринг отдельно по каждому каналу R, G, B.

Предположим, что у нас есть 8-битная картинка с градациями серого; какой самый простой способ сохранить её как двухцветную (монохромную, 1 бит на точку) [2]?

1-битные изображения все еще используются в коммерческой печати. Обычный файл формата CMYK или картинка с градациями серого перед созданием плат офсетной печати преобразуются в 1-битное изображение. Картинка, печатаемая на лазерном принтере, также считается в какой-то момент растровым 1-битным изображением. Изображения на футболках или шевронах часто печатаются как 1-битные (вспомните классическое изображение профиля Эрнесто Че Гевары).

Не существует простого метода получить монохромный растр из многоцветного. Всегда перед преобразованием необходимо сделать некоторый выбор. Рассмотрим несколько примеров.

Исходная картинка:

XinXin 01 GrayScale

Линейное преобразование. В этом случае выбирается некий пороговый уровень яркости, выше которой точка считается белой, и ниже этой яркости точка считается черной. Ниже показан пример такого преобразования при выбранном пороге яркости 50%.

XinXin 02 50Threshold

При таком преобразовании можно регулировать порог оценки яркости:

XinXin 03 ControledThreshold

Дизеринг. Этот вид преобразования используется в некоторых монохромных цифровых принтерах для передачи оттенков серого.

XinXin 04 Dithered

Разновидностью дизеринга является применение стандартных шаблонов точек для передачи уровней яркости (postscript pattern). Картинки после такое преобразования могут в некоторых случаях лучше выглядеть при отображении на цифровых мониторах.

XinXin 05 Postcript

[Хранение растра bitmap]

Наиболее очевидный способ сохранить растр bitmap - просто представить информацию в виде списка точек, байт за байтом, строка за строкой. Файлы, где графическая информация сохранена таким способом, часто называют RAW-файлами (raw переводится как "сырые данные"). Размер места хранения для такого файла можно вычислить по количеству точек в картинке (размерам растра bitmap N x M) и глубине цвета каждой точке в битах (B). Вот формула для вычисления размера файла:

                               N * M * B
размер файла (в килобайтах) = —————————
                               8 * 1024

Здесь N и M это количество точек (пикселов) картинки по горизонтали и вертикали, и B это количество бит, которыми закодирован каждый пиксел. В следующей таблице показаны размеры файлов картинок bitmap, если они будут сохранены в формате RAW.

размер картинки       глубина цвета     размер файла
    128 x 128             1 bit            2 KB
                          8 bits          16 KB
                         24 bits          48 KB
    256 x 256             1 bit            8 KB
                          8 bits          64 KB
                         24 bits         192 KB
     1K x 1K              1 bit          128 KB
                          8 bits           1 MB
                         24 bits           3 MB

Как можно увидеть из таблицы, формат 24 бита на точку дают файлы большого размера, в этом случае применение компрессии файла становится важным. Есть множество вариантов сжатия (компрессии) изображений bitmap от очень простых до весьма сложных. Но всегда имеется два основных формата при использовании сжатия - lossless (когда файл сжимается без потерь, что дает самое лучшую передачу оригинальной картинки) и lossy (когда теряется некоторая часть графической информации). Ниже показана основная иерархия техник компрессии.

storagefig2

Самый грубый способ уменьшить размер файлов - ухудшить кодирование информации цвета, это так называемая техника редукции бит (bit reduction), или квантизация (quantization). Один из примеров - преобразование растра 24 bit bitmap в 8 bit indexed bitmap с использованием дизеринга для симуляции потерянных цветов. Наиболее известен среди форматов с потерями формат JPEG, и описание его работы выходит за рамки нашего обсуждения. Его основное преимущество в том, что он может предложить намного большую степень сжатия, чем форматы сжатия без потерь. Для примера рассмотрим следующую картинку bitmap с оригинальным размером 500 x 350 пикселей и 24 битами кодирования цвета на точку. По формуле для формата RAW размер не сжатого файла получится 500 x 350 x 24 / 8 / 1024 = 513 килобайт.

storagefig3

Сохранение этой же картинки в формате с градациями серого (редукцией бит) даст размер 171 килобайт (в 3 раза меньше), сохранение с сжатием RLE даст 388 килобайт (75% от оригинала), сохранение со сжатием LZW даст 188 килобайт (36% от оригинала), и сохранение в JPEG даст 30 килобайт (коэффициент сжатия 17:1).

Ниже мы рассмотрим пример самой простой техники сжатия без потерь, которая называется кодирование длины (run length encoding, RLE). Эта техника дает хороший выигрыш на картинках, где небольшое количество цветов. Предположим, что у нас есть маленькая картинка размером 16 x 10 пикселей, с кодированием цвета 8 бит.

storagefig4

Если картинка была сохранена в RAW, то для неё понадобится 16 байт на строку, всего 10 строк, т. е. 160 байт. Однако, как можно увидеть, первые две строки содержат точки одного и того же уровня, так что более эффективно сохранить количество точек и их уровень, чем сохранять уровень каждой точки по отдельности. Таким образом, на каждую строку вместо 16 байт можно оставить только 2 байта.

В формате raw первые 3 строки будут выглядеть так:

0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0
0 0 1 1 1 1 1 1 1 1 1 1 1 1 0 0

С использованием сжатия RLE данные этих трех строк будут закодированы так:

16 0
16 0
2 0 12 1 2 0

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

[Форматы файлов растровых изображений]

Следующий список дает краткое описание некоторых форматов, широко применяющихся для сохранения bitmap.

Используется на платформах: главным образом поддерживается на Mac/DOS-WINDOWS/Unix.

Владелец: Aldus

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

Используется на платформах: изначально на DOS-WINDOWS.

Владелец: ZSoft Corp

Примечания: самый старый и наиболее широко используемый формат на компьютерах с DOS. Может поддерживать индексированный цвет 24 бита. Кодируется только по принципу RLE.

Используется на платформах: наиболее часто поддерживается на Mac/DOS-WINDOWS/Unix.

Владелец: CompuServe

Примечания: GIF также является очень популярным форматом. Чаще всего он используется на билбоардах и в Интернет. Кодирование ограничено 8 бит на точку с применением индексации цветов (палитра), для компрессии используется LZW. Может содержать в себе несколько изображений и текстовые оверлеи, поддерживается прозрачность, и также может содержать в себе несколько картинок, что позволяет делать анимацию изображений.

Используется на платформах: исключительно Mac.

Владелец: Apple

Примечания: PICT используется только на компьютерах Macintosh. Реализация PICT на Macintosh работает на уровне операционной системы, и поддерживается всеми приложениями Macintosh. Этот формат отвечает за обмен изображениями на Macintosh и используется в операциях cut/copy/paste. Поддерживаются большинство пространств цвета и методов сжатия, включая JPEG.

Используется на платформах: наиболее часто поддерживается на Mac/DOS-WINDOWS/Unix.

Владелец: владельца нет, формат свободен от патентов

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

Используется на платформах: все платформы

Владелец: владельца нет

Примечания: это самый простой метод для сохранения картинок из всех, просто сохранение "сырых" (raw) байтов. Часто используется в фотокамерах для записи изображений. Например, один байт на точку для greyscale или 3 байта на точку для цветов RGB. Не существует единого стандарта на заголовок файлов RAW, это может определять сам производитель фотографического оборудования.

Используется на платформах: все платформы, изначально на UNIX

Владелец: владельца нет

Примечания: это несколько больше, чем простой raw формат, имеются некоторые согласованные части заголовка. Обычно используется для картинок 8 бит greyscale или цветных 24 bit RGB.

Используется на платформах: главным образом исключительно на DOS/Atari

Владелец: Digital Research

Примечания: поддерживается операционной системой GEM.

Используется на платформах: главным образом исключительно Amiga

Владелец: Electronic Arts

Примечания: поддерживается 4-битная таблица цветов и 24-битные цвета.

Используется на платформах: смешанная поддержка на Mac/DOS-WINDOWS/UNIX

Владелец: TrueVision Inc

Примечания: изначально разработана для плат захвата изображений VISTA. Несколько больше, чем простой RAW-формат, есть заголовок с дополнительной информацией.

Используется на платформах: главным образом DOS-Windows

Владелец: MicroSoft

Примечания: формат MicroSoft Windows, раньше использовался в основном только на ней, но потом благодаря своей простоте обрел популярность. Несжатые варианты особенно удобно использовать на маломощных встраиваемых системах. Поддерживаются глубина цвета от greyscale 1, 2, 4, 8 бита на точку до 32 битных цветных изображений.

Используется на платформах: Primarily Sun

Владелец: Sum MicroSystems

Примечания: Only supported by Sun. Use RLE and either 8 bit greyscale or 24/32 bit colour.

Используется на платформах: в основном платформа X system

Владелец: MIT X Corp

Примечания: специально для программной реализации отображения растровых картинок в оконной системе X windows, используется для курсоров и иконок.

Используется на платформах: в основном платформа X system

Владелец: MIT X Corp

Примечания: формат сохранения экрана в X windows. Поддерживается глубина цвета от монохрома до 24 бит на точку с прямым кодированием цветов.

[Ссылки]

1. A Beginners Guide to Bitmaps site:paulbourke.net, written by Paul Bourke.
2Saving an 8-bit grayscale image as a 2-bit image site:graphicdesign.stackexchange.com.

 

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


Защитный код
Обновить

Top of Page