Опубликован: 27.07.2006 | Уровень: для всех | Доступ: платный
Лекция 3:

Графика на компьютере

Аннотация: В этой лекции рассматриваются особенности графических форматов и растровой графики, векторная графика, средства работы с графикой. Описываются приемы работы в Paint, XPaint, GIMP, GFig, XFig. Показан процесс ввода графики в ЭВМ.
Ключевые слова: информация, байт, значение, геометрическая фигура, picture element, растровая графика, язык гипертекстовой разметки, ячейка, массив, координаты, векторная графика, кодирование информации, RLE, LZW, PCX, deflating, GIF, JPEG, compuserve, interlace, полиграфия, cube, объект, прямоугольник, Окружность, Эллипс, B-сплайны, программа, размер файла, векторные, работ, сканер, paint, Windows, место, icon editor, windows 95, операции, отображение, инвертирование, меню, пункт, цвет фона, файл, save, AS, диалоговое окно, путь, диск, шрифт, прямой, отрезок, тип объекта, мышь, shift, копирование, команда, параметр, множества, ПО, лист, Zoom, paste, выход, семейство шрифта, двоичное представление, список операций, диапазон, MATCH, компонент, fixed, Пейзаж, Графический редактор, GNU, запуск, загрузка данных, кадрирование, позиция курсора, контур, растушевка, многочлен, домашняя директория, logo, boundary, альфа-канал, маска слоя, Интернет, слово, анимация, чередование, кадр, курсор, combination, создание кнопок, единица, управление курсором, узловой, шкала измерений

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

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

Как кодируется и хранится в ЭВМ графическая иформация, что такое графический формат изображения и как он влиет на его качество и размер? На эти и многие другие вопросы вы найдете ответ в этом разделе учебного пособия.

Особенности графических форматов

Как вы уже знаете, любая информация, хранящаяся в файле, - это последовательность байт. Каждый байт может принимать значение от 0 до 255 (28-1). Способ записи информации с помощью последовательности байт и называют форматом файла. То есть, графический формат - это способ записи графической информации.

Способ представления изображения оказывает влияние на возможности его редактирования, печати, на объем занимаемой памяти.

Векторный формат

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

Растровый формат

Растровый формат, с которым мы познакомимся подробнее, характеризуется тем, что все изображение по вертикали и горизонтали разбивается на достаточно мелкие прямоугольники - так называемые элементы изображения, или пикселы (от английского pixel - picture element).


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

Размер ( size ) изображения, хранящегося в файле, задается в виде числа пикселов по горизонтали ( width ) и вертикали ( height ). Для примера, оптимальное разрешение 15-дюймового монитора, как правило, составляет 1024x768.

Глубина цвета

Кроме размера изображения, важной является информация о количестве цветов, закодированных в файле. Цвет каждого пиксела кодируется определенным числом бит ( bit ), то есть элементарных единиц информации, с которыми может иметь дело компьютер. Каждый бит может принимать два значения - 1 или 0. В зависимости от того, сколько бит отведено для цвета каждого пиксела, возможно кодирование различного числа цветов. Нетрудно сообразить, что если для кодировки отвести лишь один бит, то каждый пиксел может быть либо белым (значение 1), либо черным (значение 0). Такое изображение называют монохромным monochrome ).

Далее, если для кодировки отвести четыре бита, то можно закодировать 24=16 различных цветов, отвечающих комбинациям бит от 0000 до 1111. Если отвести 8 бит - то такой рисунок может содержать 28=256 различных цветов (от 00000000 до 11111111), 16 бит - 216=65 536 различных цветов (так называемый High Color ). И, наконец, если отвести 24 бита, то потенциально рисунок может содержать 224=16 777 216 различных цветов и оттенков - вполне достаточно даже для самого взыскательного художника! В последнем случае кодировка называется 24-bit True Color. Следует обратить внимание на слово "потенциально": даже если в файле и отводится 24 бита на каждый пиксел, это еще не означает, что вы действительно сможете насладиться такой богатой палитрой - ведь технические возможности мониторов ограничены.

RGB-модель

Способ разделения цвета на составляющие компоненты называется Цветовой моделью. В компьютерной графике применяются три цветовые модели: RGB, CMYK и HSB.


Наиболее распространенным способом кодирования цвета является модель RGB. При этом способе кодирования любой цвет представляется в виде комбинации трех цветов: красного ( Red ), зеленого ( Green ) и синего ( Blue ), взятых с разной интенсивностью. Интенсивность каждого из трех цветов - это один байт (т. е. число в диапазоне от 0 до 255), который хорошо представляется двумя 16-ричными цифрами (числом от 00 до FF). Таким образом, цвет удобно записывать тремя парами 16-ричных цифр, как это принято, например, в HTML-документах.

Пример.

В языке гипертекстовой разметки документов HTML цвета можно задавать так: черный - 000000, белый - FFFFFF, желтый - FFFF00 и т. д.; чтобы получить более темный желтый цвет, надо одинаково уменьшить интенсивности красного и зеленого - A7A700.

Чем больше значение байта цветовой составляющей, тем ярче этот цвет. При наложении одной составляющей на другую яркость суммарного цвета также увеличивается.

Цветовая модель CMYK

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


Цветовыми составляющими этой модели являются цвета: голубой ( Cyan ), лиловый ( Magenta ), желтый ( Yellow ) и черный ( Black ). Эти цвета получаются в результате вычитания основных цветов модели RGB из белого цвета. Черный цвет задается отдельно. Увеличение количества краски приводит к уменьшению яркости цвета.

Цветовая модель HSB

Системы цветов RGB и CMYK связаны с ограничениями, накладываемыми аппаратным обеспечением (монитор компьютера в случае RGB и типографские краски в случае CMYK ).

Цветовая модель HSB наиболее удобна для человека, т. к. она хорошо согласуется с моделью восприятия цвета человеком. Компонентами модели HSB являются:

  • тон ( Hue );
  • насыщенность ( Saturation );
  • яркость цвета ( Brightness )

Тон - это конкретный оттенок цвета. Насыщенность характеризует его интенсивность или чистоту. Яркость же зависит от примеси черной краски, добавленной к данному цвету.

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

Особенности растровой графики

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

При оцифровке изображения оно делится на такие крошечные ячейки, что глаз человека их не видит, воспринимая все изображение как целое. Сама сетка получила название растровой карты, а ее единичный элемент называется пикселом.


Пикселы подобны зернам фотографии и при значительном увеличении они становятся заметными. Растровая карта представляет собой набор (массив) троек чисел: две координаты пиксела на плоскости и его цвет.

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

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

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

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

Формат Макс. число бит/пиксел Макс. число цветов Макс. размер изображения, пиксел Методы сжатия Кодирование нескольких изображений
BMP 24 16 777 216 65535 x 65535 RLE -
GIF 8 256 65535 x 65535 LZW +
JPEG 24 16 777 216 65535 x 65535 JPEG -
PCX 24 16 777 216 65535 x 65535 RLE -
PNG 48 281 474 976 710 656 2 147 483 647 x 2 147 483 647 Deflation (вариант LZ77) -
TIFF 24 16 777 216 всего 4 294 967 295 LZW, RLE и другие +

Из большого числа форматов графических файлов в Интернете сейчас широко используются только два - GIF и JPEG. О них и поговорим подробнее.

GIF - формат

Популярный формат GIF разработан фирмой CompuServe, как не зависящий от аппаратного обеспечения. Он предназначен для хранения растровых изображений с сжатием. В одном файле этого формата может храниться несколько изображений. Обычно эта возможность используется для хранения анимированных изображений (как набор кадров).

GIF-формат позволяет записывать изображение "через строчку" (Interlaced), благодаря чему, имея только часть файла, можно увидеть изображение целиком, но с меньшим разрешением. Эта возможность широко применяется в Интернет. Сначала вы видите картинку с грубым разрешением, а по мере поступления новых данных ее качество улучшается. Основное ограничение формата GIF состоит в том, что цветное изображение может содержать не более 256 цветов. Для полиграфии этого явно недостаточно.

JPEG - формат

Формат файла JPEG ( Joint Photographic Experts Group - Объединенная экспертная группа по фотографии ) был разработан компанией C-Cube Microsystems, как эффективный метод хранения изображений с большой глубиной цвета, например, получаемых при сканировании фотографий с многочисленными едва уловимыми (а иногда и неуловимыми) оттенками цвета.

Самое большое отличие формата JPEG от других форматов состоит в том, что в JPEG используется алгоритм сжатия с потерями (а не алгоритм без потерь).

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

Сжатие, используемое в формате JPEG, необратимо искажает изображение. Это не заметно при его простом просмотре, но становится явным при последующих манипуляциях. Зато размер файла получается от 10 до 500 раз меньше, чем BMP! Если вы решили записать изображение в формате JPEG, то лучше выполнить все необходимые операции перед первой записью файла.

Сравнение GIF и JPEG

  1. GIF-формат удобен при работе с рисованными картинками.
  2. JPEG-формат лучше использовать для хранения фотографий и изображений с большим количеством цветов.
  3. Для создания анимации и изображений с прозрачным фоном применяется GIF-формат.
Дмитрий Фаттахов
Дмитрий Фаттахов
Виктория Бельгесова
Виктория Бельгесова

Добрый день. Как получить удостоверение о прохождении данного курса?

Николай Серков
Николай Серков
Россия, г. Санкт-Петербург
Елена Сочнева
Елена Сочнева
Россия