- •© КНТЭУ, каф. ИТС, Основы веб-дизайна. Лекция №4
- •1. Введение в компьютерную графику.
- •1951 г. – В МТИ в рамках научной программы для ВМС
- •Ведущие производители оборудования для компьютерной графики:
- •Схема воспроизведения графики
- •Пиксел - это световое пятно на экpане дисплея, котоpое может пpинимать pазличные оттенки.
- •Принцип воспроизведения цвета на дисплее
- •Максимальное количество цветов, одновpеменно отобpажаемых на экpане, опpеделяется количеством битов, выделенных для каждого
- •Типы графических файлов:
- •Проблема дискретного устройства экрана решается применением методов растеризации (сглаживания),
- •2.Векторные – это такие файлы, которые хранят в себе
- •Кривые в векторном формате описываются специальными математическими функциями – сплайнами.
- •Основываясь на тригонометрических уравнениях, французский математик и инженер Пьер Безье создал особый способ
- •векторное изображение
- •Сравнительные характеристики типов графических форматов
- •2. Форматы растровых графических файлов.
- •Размеры файла рисунка в 24 битовой палитре:
- •Графический формат GIF
- •Графический формат JPEG
- •Графические редакторы:
- •3. Построение векторных изображений
- •Операции над графическими объектами:
- •4. Работа с растровой графикой
- •ВОПРОСЫ?
Проблема дискретного устройства экрана решается применением методов растеризации (сглаживания),
путем использования специальных алгоритмов. (например, алгоритм Брезенхема, преобразование Хоха,
цепное кодирование и т.д.)
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
2.Векторные – это такие файлы, которые хранят в себе
алгоритм построения изображения.
A(100,150)
C(180,130)
Хранение векторного изображения:
100,150 – 200,250 – 180,130
Отображение векторного изображения:
выбрать координту А; нарисовать линию до В; нарисовать линию до С;
B(200,250) нарисовать линию до А;
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
Кривые в векторном формате описываются специальными математическими функциями – сплайнами.
шаг 1 |
шаг 2 |
шаг n-1 |
шаг n |
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
Основываясь на тригонометрических уравнениях, французский математик и инженер Пьер Безье создал особый способ простого и в тоже время гибкого описания сложных контуров.
Этот способ получил название кривых Безье и, благодаря своей простоте и гибкости, впоследствии стал одним из важнейших методов компьютерной графики.
Кривые Безье строятся по нескольким точкам и направляющим линиям.
Точки, по которым строится кривая, называются опорными точками; каждая из них характеризуется двумя отрезками, расположенными на касательной к
кривой Безье в опорной точке (они называются
направляющими).
Длина каждой направляющей задает крутизну следующего или предыдущего сегмента кривой, а угол касательной задает направление в обе стороны от опорной точки.
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
векторное изображение |
растровое изображение |
клип-арт (clipArt) |
размер: 797К |
размер: 61K |
|
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
Сравнительные характеристики типов графических форматов
|
|
Векторный |
Растровый |
|
|
|
|
Достоинства |
|
Малый объем, |
Хорошая |
|
|
Масштабируемость |
цветопередача. |
|
|
без потери качества |
|
|
|
|
|
Недостатки |
Плохая передача |
Большой объем |
|
|
|
сложного цвета |
|
|
|
(полутонов, |
|
|
|
переходов и т.д.) |
|
|
|
|
|
Область применения |
Инженерные схемы, |
Фотография, сложная |
|
|
|
графики, анимация. |
графика |
|
|
|
(полиграфия) |
|
|
|
|
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
2. Форматы растровых графических файлов.
|
Из-за своих размеров |
|
• BMP - Windows device |
для Интернет |
|
непригодны |
||
Применяется для хранения |
||
|
• TIFF - Tagged Image File F изображений)
Аппаратно независимый формат. Является лучшим форматом для хранения растровых файлов в издательских системах.
•GIF - Graphics Interchange Format (формат графического обмена)
•JPEG - Joint Photographics Group (объединенная группа экспертов в области фотографии
•PNG - Portable Network Graphic (переносимая сетевая графика)
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
Размеры файла рисунка в 24 битовой палитре:
TIFF |
- 538 K |
|
BMP |
- 513 K |
|
JPG |
- 29 K |
|
GIF |
- 18 K |
(8 бит) |
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
Графический формат GIF
Разработан в 1987 г. в онлайновой службе CompuServe для быстрого обмена изображениями по телефонным линиям.
Время передачи уменьшается за счет того, что изображение хранится в сжатом виде.
Достоинства:
малый размер, возможность отображения на любом компьютере, черезстрочное воспроизведение в браузере, эффект «прозрачности» цветов.
Недостаток:
8-битная палитра (256 цветов)
Область применения:
несложная графика и анимация, диаграммы и т.п.
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
Графический формат JPEG
Разработан в 1995 г. для передачи и высококачественного воспроизведения сжатых изображений .
Достоинства: возможность выбора коэффициента сжатия, использование 24-битной глубины цвета. 
Недостаток: отсутствие чрезстрочного воспроизведения, средств анимации и эффекта «прозрачного» фона.
Область применения: качественное Web оформление, фотоархивы в Сети и т.п.
Графика в Web |
© КНТЭУ - 2009, каф. ИТС, доц. Шклярский С.М. |
