Technologia Informacyjna
Technologia Informacyjna
Grafika rastrowa i wektorowa
Grafika rastrowa i wektorowa
Podstawy grafiki rastrowej
Podstawy grafiki rastrowej
Wprowadzenie do grafiki rastrowej
Wprowadzenie do grafiki rastrowej
Podstawowe definicje (pixel, rozdzielczość,
Podstawowe definicje (pixel, rozdzielczość,
rozmiar, kolor, paleta)
rozmiar, kolor, paleta)
Omówienie metod zapisu obrazu, istniejących
Omówienie metod zapisu obrazu, istniejących
formatów, metod kompresji
formatów, metod kompresji
Szczegółowe omówienie najprostszego
Szczegółowe omówienie najprostszego
standardu zapisu grafiki rastrowej  formatu
standardu zapisu grafiki rastrowej  formatu
BMP
BMP
Zastosowanie grafiki rastrowej we
Zastosowanie grafiki rastrowej we
współczesnych systemach komputerowych
współczesnych systemach komputerowych
1
Wprowadzenie
Wprowadzenie
Grafika komputerowa to jedna z podstawowych
Grafika komputerowa to jedna z podstawowych
metod wizualizacji informacji przetwarzanych
metod wizualizacji informacji przetwarzanych
przez komputer. Historycznie pierwsze
przez komputer. Historycznie pierwsze
komputery nie posiadały możliwości pracy w
komputery nie posiadały możliwości pracy w
trybie graficznym  nawet praca w trybie
trybie graficznym  nawet praca w trybie
tekstowym (interakcja) pojawiła się póz
niej niż
tekstowym (interakcja) pojawiła się póz
niej niż
same komputery.
same komputery.
IstniejÄ… 2 podstawowe typy grafiki
IstniejÄ… 2 podstawowe typy grafiki
komputerowej: grafika rastrowa i grafika
komputerowej: grafika rastrowa i grafika
wektorowa. Różnią się od siebie w sposób
wektorowa. Różnią się od siebie w sposób
zasadniczy choć przez komputer zostały ze sobą
zasadniczy choć przez komputer zostały ze sobą
nierozerwalnie zwiÄ…zane.
nierozerwalnie zwiÄ…zane.
Wprowadzenie
Wprowadzenie
Grafika rastrowa operuje pojęciem punktu.
Grafika rastrowa operuje pojęciem punktu.
Obraz składa się zawsze ze skończonej ilości
Obraz składa się zawsze ze skończonej ilości
punktów przyjmujących jeden kolor z dostępnej
punktów przyjmujących jeden kolor z dostępnej
palety kolorów (też skończonej)
palety kolorów (też skończonej)
Grafika wektorowa operuje pojęciami
Grafika wektorowa operuje pojęciami
geometrycznymi. Obraz składa się ze
geometrycznymi. Obraz składa się ze
skończonej liczby obiektów typu: punkt, linia
skończonej liczby obiektów typu: punkt, linia
(prosta, krzywa), obszar&
(prosta, krzywa), obszar&
2
Grafika rastrowa
Grafika rastrowa
Obrazy rastrowe, zwane również
Obrazy rastrowe, zwane również
bitmapowymi, składają się z siatki czyli rastra
bitmapowymi, składają się z siatki czyli rastra
małych kwadracików zwanych pikselami.
małych kwadracików zwanych pikselami.
Każdy piksel w obrazie bitmapowym ma swoje
Każdy piksel w obrazie bitmapowym ma swoje
miejsce i ściśle określony kolor. Edycja bitmapy
miejsce i ściśle określony kolor. Edycja bitmapy
polega na modyfikacji poszczególnych pikseli.
polega na modyfikacji poszczególnych pikseli.
Niektóre operacje edycyjne (np. skalowanie)
Niektóre operacje edycyjne (np. skalowanie)
poza tym, że przebiegają znacznie wolniej niż w
poza tym, że przebiegają znacznie wolniej niż w
przypadku grafiki wektorowej, zazwyczaj
przypadku grafiki wektorowej, zazwyczaj
przyczyniają się do utraty jakości obrazka.
przyczyniają się do utraty jakości obrazka.
Głębia kolorów
Głębia kolorów
W pliku graficznym każdy punkt obrazu
W pliku graficznym każdy punkt obrazu
(piksel) opisany jest za pomocą określonej
(piksel) opisany jest za pomocą określonej
liczby bitów. Ta liczba nosi nazwę głębi
liczby bitów. Ta liczba nosi nazwę głębi
kolorów.
kolorów.
Pojedynczy bit może przyjmować tylko jedną z
Pojedynczy bit może przyjmować tylko jedną z
dwóch wartości: 0 albo 1, wobec czego za jego
dwóch wartości: 0 albo 1, wobec czego za jego
pomocą można zakodować jedynie dwa kolory
pomocą można zakodować jedynie dwa kolory
(np. czerń i biel). Przy dwubitowej głębi barw
(np. czerń i biel). Przy dwubitowej głębi barw
za pośrednictwem kombinacji 00, 01, 10, 11,
za pośrednictwem kombinacji 00, 01, 10, 11,
możemy wyrazić cztery kolory.
możemy wyrazić cztery kolory.
3
Głębia kolorów
Głębia kolorów
Każdy dodatkowy bit podwaja liczbę
Każdy dodatkowy bit podwaja liczbę
dostępnych barw, czyli tzw. paletę kolorów.
dostępnych barw, czyli tzw. paletę kolorów.
Znając głębię barw wyrażoną przez liczbę
Znając głębię barw wyrażoną przez liczbę
bitów opisujących każdy punkt obrazu, możemy
bitów opisujących każdy punkt obrazu, możemy
obliczyć liczbę dostępnych kolorów zgodnie z
obliczyć liczbę dostępnych kolorów zgodnie z
wyrażeniem:
wyrażeniem:
Liczba_kolorów = 2 liczba_bitów_na_piksel
Liczba_kolorów = 2 liczba_bitów_na_piksel
Typowe głębie kolorów stosowane we
Typowe głębie kolorów stosowane we
współczesnych systemach komputerowych to 8,
współczesnych systemach komputerowych to 8,
16, 24 i 48 bitów
16, 24 i 48 bitów
Podstawowe głębie kolorów
Podstawowe głębie kolorów
4
Głębia kolorów a jakość i rozmiar
Głębia kolorów a jakość i rozmiar
1. Obraz w pełnej przestrzeni barw, 2. Obraz w palecie 256 barw, jakość
najlepsza jakość, objętość: 47 KB. porównywalna z najlepszą, objętość: 17 KB.
3. Obraz w palecie 216 barw, jakość 4. Obraz w palecie 16 barw, jakość niewiele
wyraz
nie gorsza, objętość: 17 KB gorsza od 216 barw, objętość: 8 KB
Rozdzielczość obrazu a jego rozmiar
Rozdzielczość obrazu a jego rozmiar
Rozdzielczość - parametr określający jak gęsto
Rozdzielczość - parametr określający jak gęsto
rozmieszczone sÄ… punkty tworzÄ…ce obraz.
rozmieszczone sÄ… punkty tworzÄ…ce obraz.
Zazwyczaj określa się ją w jednostkach dpi
Zazwyczaj określa się ją w jednostkach dpi
(ang. dots per inch), czyli liczbie punktów
(ang. dots per inch), czyli liczbie punktów
przypadajÄ…cych na cal.
przypadajÄ…cych na cal.
Razem z rozmiarem i głębią kolorów,
Razem z rozmiarem i głębią kolorów,
rozdzielczość decyduje o wielkości pliku
rozdzielczość decyduje o wielkości pliku
graficznego.
graficznego.
Dla przypadku bez kompresji rozmiar pliku
Dla przypadku bez kompresji rozmiar pliku
można obliczyć jako iloczyn rozmiaru i
można obliczyć jako iloczyn rozmiaru i
rozdzielczości oraz głębi kolorów
rozdzielczości oraz głębi kolorów
5
Obliczanie rozmiaru obrazu
Obliczanie rozmiaru obrazu
Systemy kolorów
Systemy kolorów
Nieskończoną różnorodność naturalnej skali
Nieskończoną różnorodność naturalnej skali
kolorów można dla ludzkiego oka odtworzyć,
kolorów można dla ludzkiego oka odtworzyć,
mieszając tylko trzy długości fal.
mieszając tylko trzy długości fal.
Dobierając natężenia fal o tych trzech
Dobierając natężenia fal o tych trzech
długościach, można naśladować prawie
długościach, można naśladować prawie
każdą barwę widma. Oparta na tym zjawisku
każdą barwę widma. Oparta na tym zjawisku
technika generowania barwnego światła nazywa
technika generowania barwnego światła nazywa
się "syntezą trójchromatyczną".
się "syntezą trójchromatyczną".
W systemie RGB (ang. Red, Green, Blue) każdy
W systemie RGB (ang. Red, Green, Blue) każdy
kolor przedstawia się jako mieszankę kolorów:
kolor przedstawia się jako mieszankę kolorów:
czerwonego, zielonego i niebieskiego
czerwonego, zielonego i niebieskiego
6
Systemy kolorów
Systemy kolorów
Barwa prosta to światło o jednej, ściśle
Barwa prosta to światło o jednej, ściśle
określonej długości fali. Nazywana jest też
określonej długości fali. Nazywana jest też
barwÄ… czystÄ… lub widmowÄ… (spektralnÄ…), bo
barwÄ… czystÄ… lub widmowÄ… (spektralnÄ…), bo
reprezentuje punkt widma światła białego.
reprezentuje punkt widma światła białego.
Barwy podstawowe to dowolne trzy barwy
Barwy podstawowe to dowolne trzy barwy
proste, dobrane tak, że przez zmieszanie
proste, dobrane tak, że przez zmieszanie
dowolnych dwóch spośród nich nie jest
dowolnych dwóch spośród nich nie jest
możliwe uzyskanie trzeciej, natomiast przez
możliwe uzyskanie trzeciej, natomiast przez
mieszanie trzech można uzyskać wrażenie
mieszanie trzech można uzyskać wrażenie
dowolnej barwy prostej.
dowolnej barwy prostej.
Długość fali (nanometry)
Systemy kolorów
Systemy kolorów
Cały zakres barw prostych
Cały zakres barw prostych
(widmo) daje się ująć w
(widmo) daje się ująć w
zamknięty krąg barw, w
zamknięty krąg barw, w
którym każda barwa
którym każda barwa
prosta ma swojÄ… barwÄ™
prosta ma swojÄ… barwÄ™
diametralnie
diametralnie
przeciwstawnÄ…, a
przeciwstawnÄ…, a
jednocześnie każda może
jednocześnie każda może
być wyrażona przez
być wyrażona przez
zmieszanie, w odpowiednich
zmieszanie, w odpowiednich
proporcjach, trzech barw
proporcjach, trzech barw
podstawowych
podstawowych
7
Systemy kolorów
Systemy kolorów
W przedstawionym modelu syntezy
W przedstawionym modelu syntezy
trójchromatycznej podobne wartości
trójchromatycznej podobne wartości
względne kanałów R, G i B dają inną barwę
względne kanałów R, G i B dają inną barwę
przy innym poziomie natężenia.
przy innym poziomie natężenia.
Zmiana natężenia światła białego prowadzi od
Zmiana natężenia światła białego prowadzi od
czystej bieli, poprzez szarości do czerni - braku
czystej bieli, poprzez szarości do czerni - braku
światła.
światła.
Systemy kolorów
Systemy kolorów
Model mieszania barw prostych, który dawał
Model mieszania barw prostych, który dawał
się przedstawić na płaszczyz
nie koła barw, staje
się przedstawić na płaszczyz
nie koła barw, staje
się, po uwzględnieniu natężenia, modelem
się, po uwzględnieniu natężenia, modelem
przestrzennym.
przestrzennym.
Model przestrzenny stanowi kulÄ™, gdzie
Model przestrzenny stanowi kulÄ™, gdzie
biegunami są biel i czerń, a "równik" to
biegunami są biel i czerń, a "równik" to
poznany już krąg barw prostych. Oś łącząca
poznany już krąg barw prostych. Oś łącząca
bieguny, to skala szarości czyli barw
bieguny, to skala szarości czyli barw
achromatycznych, zaÅ› wszystkie punkty
achromatycznych, zaÅ› wszystkie punkty
wewnÄ…trz kuli i na jej powierzchni reprezentujÄ…
wewnÄ…trz kuli i na jej powierzchni reprezentujÄ…
w sumie wszystkie wrażenia barwne, jakie oko
w sumie wszystkie wrażenia barwne, jakie oko
ludzkie jest w stanie rozróżnić.
ludzkie jest w stanie rozróżnić.
8
Systemy kolorów  model przestrzenny
Systemy kolorów  model przestrzenny
uwzględniający natężenie światła (HSB)
uwzględniający natężenie światła (HSB)
Model barwny HSB
Model barwny HSB
Model nazywany HSB (kula barw), przypisuje
Model nazywany HSB (kula barw), przypisuje
każdej barwie trzy parametry:
każdej barwie trzy parametry:
Hue - odcień, mierzony kątowo, jak na kręgu
Hue - odcień, mierzony kątowo, jak na kręgu
barw prostych, 0-360°. Wartość "hue" najbliżej
barw prostych, 0-360°. Wartość "hue" najbliżej
odpowiada potocznym określeniom kolorów
odpowiada potocznym określeniom kolorów
Saturation - nasycenie, oddalenie od osi
Saturation - nasycenie, oddalenie od osi
szarości, mierzone w skali 0-100
szarości, mierzone w skali 0-100
Brightness - jasność, traktowana jako oddalenie
Brightness - jasność, traktowana jako oddalenie
od czerni a zbliżenie do bieli (czyli
od czerni a zbliżenie do bieli (czyli
przyciemnienie lub rozjaśnienie), mierzone w
przyciemnienie lub rozjaśnienie), mierzone w
skali 0-100
skali 0-100
9
Model barwny RGB
Model barwny RGB
Jeśli czarny i biały biegun kuli odwzorujemy jako
Jeśli czarny i biały biegun kuli odwzorujemy jako
przeciwległe rogi sześcianu, to otrzymamy
przeciwległe rogi sześcianu, to otrzymamy
regularny model pasujący do układu trzech osi
regularny model pasujący do układu trzech osi
przestrzeni.
przestrzeni.
Czerń znajduje się w początku układu, i ma
Czerń znajduje się w początku układu, i ma
wartości R=0, G=0, B=0, czyli brak światła,
wartości R=0, G=0, B=0, czyli brak światła,
przeciwległy róg to biel
przeciwległy róg to biel
Na krawędziach nie stykających się z
Na krawędziach nie stykających się z
punktem czerni i bieli znajdujÄ… siÄ™ barwy
punktem czerni i bieli znajdujÄ… siÄ™ barwy
proste. Przekątna sześcianu, od punktu czerni
proste. Przekątna sześcianu, od punktu czerni
do bieli, reprezentuje skalę szarości, czyli
do bieli, reprezentuje skalę szarości, czyli
wszystkie punkty, dla których R=G=B.
wszystkie punkty, dla których R=G=B.
Modele substraktywne
Modele substraktywne
Model RGB jest przykładem modelu
Model RGB jest przykładem modelu
addytywnego gdzie mamy do czynienia z
addytywnego gdzie mamy do czynienia z
mieszaniem światła z
ródłowego (R,G,B) w celu
mieszaniem światła z
ródłowego (R,G,B) w celu
uzyskania nowej barwy. Poszczególne składowe
uzyskania nowej barwy. Poszczególne składowe
sumują się dając przy maksymalnym natężeniu
sumują się dając przy maksymalnym natężeniu
barwę białą.
barwę białą.
Z modelami substraktywnymi mamy do
Z modelami substraktywnymi mamy do
czynienia wtedy gdy padające światło jest
czynienia wtedy gdy padające światło jest
częściowo pochłaniane przez obiekt (np.
częściowo pochłaniane przez obiekt (np.
barwnik na papierze). Zmieszanie ze sobÄ…
barwnik na papierze). Zmieszanie ze sobÄ…
barwników pochłaniających różne części widma
barwników pochłaniających różne części widma
da w efekcie barwÄ™ czarnÄ…
da w efekcie barwÄ™ czarnÄ…
10
Model substraktywny CMYK
Model substraktywny CMYK
Model ten tworzÄ… trzy barwy:
Model ten tworzÄ… trzy barwy:
Cyan - jasnoniebieska (niebiesko-zielona)
Cyan - jasnoniebieska (niebiesko-zielona)
Magenta - czerwono-różowa (purpurowa)
Magenta - czerwono-różowa (purpurowa)
Yellow - żółta
Yellow - żółta
Dodatkowo w modelu występuje barwa czarna
Dodatkowo w modelu występuje barwa czarna
(blacK) ponieważ barwy podstawowe (ze
(blacK) ponieważ barwy podstawowe (ze
względów technologicznych) nie sumują się do
względów technologicznych) nie sumują się do
całkowitej czerni.
całkowitej czerni.
Model RGB a CMYK
Model RGB a CMYK
Między barwami RGB a CMY zachodzi
Między barwami RGB a CMY zachodzi
szczególna współzależność: każde dwie barwy
szczególna współzależność: każde dwie barwy
jednego modelu składają się (odpowiednio:
jednego modelu składają się (odpowiednio:
addytywnie lub substraktywnie) na jednÄ… z
addytywnie lub substraktywnie) na jednÄ… z
drugiego, np: zmieszanie farby żółtej (Y) z
drugiego, np: zmieszanie farby żółtej (Y) z
purpurową (M) da czerwień taką, jak światło
purpurową (M) da czerwień taką, jak światło
czerwone (R).
czerwone (R).
11
Paleta kolorów
Paleta kolorów
Atrybutem pojedynczego elementu obrazu
Atrybutem pojedynczego elementu obrazu
(piksela) w zapisie rastrowym lub obiektu w
(piksela) w zapisie rastrowym lub obiektu w
zapisie wektorowym może być definicja jego
zapisie wektorowym może być definicja jego
koloru (np. jako mieszanki kolorów w
koloru (np. jako mieszanki kolorów w
standardzie RGB) lub numer koloru we
standardzie RGB) lub numer koloru we
wcześniej przygotowanej tabeli kolorów (tzw.
wcześniej przygotowanej tabeli kolorów (tzw.
palecie).
palecie).
Na przykład 256-kolorowy obraz formatu gif ma
Na przykład 256-kolorowy obraz formatu gif ma
paletę 256 barw, wybranych spośród większej
paletę 256 barw, wybranych spośród większej
liczby barw możliwych do określenia. Zmiana
liczby barw możliwych do określenia. Zmiana
definicji jednego koloru palety spowoduje
definicji jednego koloru palety spowoduje
zmianę barwy wszystkich elementów
zmianę barwy wszystkich elementów
obrazu, którym kolor ten był przypisany.
obrazu, którym kolor ten był przypisany.
Formaty zapisu grafiki rastrowej
Formaty zapisu grafiki rastrowej
bmp (Bitmap), zapis bez kompresji
bmp (Bitmap), zapis bez kompresji
.pcx (Paintbrush), zapis z prostÄ… kompresjÄ…
.pcx (Paintbrush), zapis z prostÄ… kompresjÄ…
.gif (Graphics Interchange Format), zapis z
.gif (Graphics Interchange Format), zapis z
kompresjÄ… bezstratnÄ…, do 256 barw
kompresjÄ… bezstratnÄ…, do 256 barw
.jpeg (Joint Photo Expert Group), zapis z
.jpeg (Joint Photo Expert Group), zapis z
kompresjÄ… stratnÄ…
kompresjÄ… stratnÄ…
.png (Portable Network Graphics), zapis z
.png (Portable Network Graphics), zapis z
kompresjÄ… stratnÄ….
kompresjÄ… stratnÄ….
.tif (Targa Interchange Format), otwarty format
.tif (Targa Interchange Format), otwarty format
roboczy grafiki rastrowej dla skanerów i
roboczy grafiki rastrowej dla skanerów i
edytorów graficznych.
edytorów graficznych.
12
Formaty zapisu grafiki rastrowej
Formaty zapisu grafiki rastrowej
Przy zapisie obrazu (bez kompresji) informacje o
Przy zapisie obrazu (bez kompresji) informacje o
barwie poszczególnych punktów są zapisywane
barwie poszczególnych punktów są zapisywane
jedna po drugiej w ustalonej kolejności, na
jedna po drugiej w ustalonej kolejności, na
przykład:
przykład:
00000000000000000000000000000000
00000000000000000000000000000000
00000000000011111110000000000000
00000000000011111110000000000000
00000000011111111111110000000000
00000000011111111111110000000000
00000000111111111111111000000000
00000000111111111111111000000000
00000011111100000001111110000000
00000011111100000001111110000000
00000111100000000000001111000000
00000111100000000000001111000000
00001111000000000000000111100000
00001111000000000000000111100000
00001110000111000111000011100000
00001110000111000111000011100000
00011100000121000121000001110000
00011100000121000121000001110000
00111100000111000111000001111000
00111100000111000111000001111000
00111000000000000000000000111000
00111000000000000000000000111000
00111000000000000000000000111000
00111000000000000000000000111000
01111000000000000000000000111100
01111000000000000000000000111100
01110000100000000000011000011100
01110000100000000000011000011100
01110001100000000000011100011100
01110001100000000000011100011100
01110011100000000000001110011100
01110011100000000000001110011100
01110010110000000000011010011100
01110010110000000000011010011100
01110000110000000000011000011100
01110000110000000000011000011100
01111000011000000000110000111100
01111000011000000000110000111100
00111000011100000001110000111000
00111000011100000001110000111000
00111000001110000011100000111000
00111000001110000011100000111000
00111100000111111111000001111000
00111100000111111111000001111000
00011100000011111110000001110000
00011100000011111110000001110000
00001110000000111000000011100000
00001110000000111000000011100000
00001111000000000000000111100000
00001111000000000000000111100000
00000111100000000000001111000000
00000111100000000000001111000000
00000011111100000001111110000000
00000011111100000001111110000000
00000000111111111111111000000000
00000000111111111111111000000000
00000000011111111111110000000000
00000000011111111111110000000000
00000000000011111110000000000000
00000000000011111110000000000000
00000000000000000000000000000000
00000000000000000000000000000000
Formaty zapisu grafiki rastrowej
Formaty zapisu grafiki rastrowej
Istnieje wiele sposobów kompresowania
Istnieje wiele sposobów kompresowania
danych. Jeden z nich (najprostszy) polega
danych. Jeden z nich (najprostszy) polega
na zastÄ…pieniu powtarzajÄ…cego siÄ™ znaku
na zastÄ…pieniu powtarzajÄ…cego siÄ™ znaku
(ciągu znaków) jego jednym egzemplarzem
(ciągu znaków) jego jednym egzemplarzem
i adnotacją o liczbie powtórzeń:
i adnotacją o liczbie powtórzeń:
-------------------------------- 32-
-------------------------------- 32-
------------*******------------- 12-7*13-
------------*******------------- 12-7*13-
---------*************---------- 9-13*10-
---------*************---------- 9-13*10-
--------***************--------- 8-15*9-
--------***************--------- 8-15*9-
------******-------******------- 6-6*7-6*7-
------******-------******------- 6-6*7-6*7-
-----****-------------****------ 5-4*13-4*6-
-----****-------------****------ 5-4*13-4*6-
----****---------------****----- 4-4*15-4*5-
----****---------------****----- 4-4*15-4*5-
----***----***---***----***----- 4-3*4-3*3-3*4-3*5-
----***----***---***----***----- 4-3*4-3*3-3*4-3*5-
---***-----*@*---*@*-----***---- 3-3*5-1*1@1*3-1*1@1*5-3*4-
---***-----*@*---*@*-----***---- 3-3*5-1*1@1*3-1*1@1*5-3*4-
--****-----***---***-----****--- 2-4*5-3*3-3*5-4*3-
--****-----***---***-----****--- 2-4*5-3*3-3*5-4*3-
--***---------------------***--- 2-3*21-3*3-
--***---------------------***--- 2-3*21-3*3-
13
Formaty zapisu grafiki rastrowej
Formaty zapisu grafiki rastrowej
Przedstawiony wcześniej sposób kompresji
Przedstawiony wcześniej sposób kompresji
danych ma poważną wadę - wraz ze wzrostem
danych ma poważną wadę - wraz ze wzrostem
złożoności obrazka zwiększa się objętość
złożoności obrazka zwiększa się objętość
danych  skompresowanych (nawet kilkukrotnie
danych  skompresowanych (nawet kilkukrotnie
 przy bardzo złożonych obrazach o szczególnie
 przy bardzo złożonych obrazach o szczególnie
niekorzystnym układzie pikseli).
niekorzystnym układzie pikseli).
Aby uniknąć tego typu problemów stosuje się
Aby uniknąć tego typu problemów stosuje się
bardziej zaawansowane algorytmy kompresji
bardziej zaawansowane algorytmy kompresji
bezstratnej lub kompresji stratnej
bezstratnej lub kompresji stratnej
Formaty zapisu grafiki rastrowej
Formaty zapisu grafiki rastrowej
Przedstawiony wcześniej sposób kompresji
Przedstawiony wcześniej sposób kompresji
danych ma poważną wadę - wraz ze wzrostem
danych ma poważną wadę - wraz ze wzrostem
złożoności obrazka zwiększa się objętość
złożoności obrazka zwiększa się objętość
danych  skompresowanych (nawet kilkukrotnie
danych  skompresowanych (nawet kilkukrotnie
 przy bardzo złożonych obrazach o szczególnie
 przy bardzo złożonych obrazach o szczególnie
niekorzystnym układzie pikseli).
niekorzystnym układzie pikseli).
Aby uniknąć tego typu problemów stosuje się
Aby uniknąć tego typu problemów stosuje się
bardziej zaawansowane algorytmy kompresji
bardziej zaawansowane algorytmy kompresji
bezstratnej (po dekompresji możliwe jest
bezstratnej (po dekompresji możliwe jest
odtworzenie wersji pierwotnej danych) lub
odtworzenie wersji pierwotnej danych) lub
kompresji stratnej (operacja taka jest
kompresji stratnej (operacja taka jest
nieodwracalna i zawsze wiąże się z
nieodwracalna i zawsze wiąże się z
pogorszeniem jakości obrazka  bywa iż czasem
pogorszeniem jakości obrazka  bywa iż czasem
niezauważalnym dla ludzkiego oka)
niezauważalnym dla ludzkiego oka)
14
Kompresja bezstratna
Kompresja bezstratna
Polega na takim przekształceniu danych aby
Polega na takim przekształceniu danych aby
możliwe było odtworzenie ich wersji pierwotnej
możliwe było odtworzenie ich wersji pierwotnej
W bardziej zaawansowanych technikach
W bardziej zaawansowanych technikach
kompresji sprawdza siÄ™, czy rozpatrywany w
kompresji sprawdza siÄ™, czy rozpatrywany w
bieżącej chwili ciąg wystąpił już wcześniej. Jeżeli
bieżącej chwili ciąg wystąpił już wcześniej. Jeżeli
tak to zamiast ciągu znaków zapisywana jest
tak to zamiast ciągu znaków zapisywana jest
adnotacja o miejscu jego poprzedniego
adnotacja o miejscu jego poprzedniego
wystąpienia (odsyłacz).
wystąpienia (odsyłacz).
Z metody tej korzysta się np. w formacie plików
Z metody tej korzysta się np. w formacie plików
gif. W niektórych formatach zapisu można dla
gif. W niektórych formatach zapisu można dla
uzyskania efektu kompresji wykorzystać typowe
uzyskania efektu kompresji wykorzystać typowe
algorytmy kompresji danych np. format .tif
algorytmy kompresji danych np. format .tif
korzysta z algorytmu LZW
korzysta z algorytmu LZW
Kompresja bezstratna
Kompresja bezstratna
Porównanie wielkości i jakości obrazka 200
Porównanie wielkości i jakości obrazka 200
pikseli x 200 pikseli bez kompresji (format
pikseli x 200 pikseli bez kompresji (format
BMP) i z kompresjÄ… (format GIF) Format GIF
BMP) i z kompresjÄ… (format GIF) Format GIF
ma dodatkowo ograniczenie do 256 kolorów (8
ma dodatkowo ograniczenie do 256 kolorów (8
bitów na piksel - w tym przypadku bez
bitów na piksel - w tym przypadku bez
pogorszenia jakości ponieważ rysunek jest
pogorszenia jakości ponieważ rysunek jest
prosty)
prosty)
GIF 256 kolorów
BMP 16mln kolorów
4510 bajtów
120054 bajty
15
Kompresja bezstratna
Kompresja bezstratna
Porównanie wielkości i jakości obrazka 200
Porównanie wielkości i jakości obrazka 200
pikseli x 200 pikseli (format GIF) dla różnej
pikseli x 200 pikseli (format GIF) dla różnej
ilości kolorów (256, 16 i 4 kolory czyli dla głębi
ilości kolorów (256, 16 i 4 kolory czyli dla głębi
kolorów 8, 4 i 2 bity)
kolorów 8, 4 i 2 bity)
GIF 256 kolorów GIF 16 kolorów GIF 4 kolory
4510 bajtów 2630 bajtów 1565 bajtów
Kompresja stratna
Kompresja stratna
Wykorzystuje się fakt, iż dane są przeznaczone
Wykorzystuje się fakt, iż dane są przeznaczone
do oglÄ…dania. Wprowadzenie pewnych zmian
do oglÄ…dania. Wprowadzenie pewnych zmian
w układzie punktów barwnych na fotografii może
w układzie punktów barwnych na fotografii może
być niezauważalne dla odbiorcy, lecz istotne
być niezauważalne dla odbiorcy, lecz istotne
dla zmniejszenia rozmiaru pliku.
dla zmniejszenia rozmiaru pliku.
Z zapisu stratnego nie można wiernie
Z zapisu stratnego nie można wiernie
odtworzyć pierwowzoru informacji.
odtworzyć pierwowzoru informacji.
Jeden z najpopularniejszych formatów zapisu
Jeden z najpopularniejszych formatów zapisu
obrazów (.jpeg) korzysta z kompresji
obrazów (.jpeg) korzysta z kompresji
nieodwracalnej. Jest to format świetny do
nieodwracalnej. Jest to format świetny do
fotografii, lecz zupełnie nie nadaje się do
fotografii, lecz zupełnie nie nadaje się do
rysunków technicznych ani do wykresów.
rysunków technicznych ani do wykresów.
16
Kompresja stratna
Kompresja stratna
Różne stopnie kompresji JPG oryginalnego
Różne stopnie kompresji JPG oryginalnego
obrazka o objętości 47 KB
obrazka o objętości 47 KB
50% 85% 95% 99%
3,96 KB 2,17 KB 1,23 KB 0,96 KB
Kompresja stratna
Kompresja stratna
Kiepski efekt kompresji JPG oryginalnego
Kiepski efekt kompresji JPG oryginalnego
obrazka o prostej geometrycznie zawartości
obrazka o prostej geometrycznie zawartości
(wykresy, teksty, prosta grafika). Wszystkie
(wykresy, teksty, prosta grafika). Wszystkie
obrazy z 24 bitową głębią kolorów.
obrazy z 24 bitową głębią kolorów.
BMP 16mln kolorów JPG 20% kompresja JPG 50% kompresja
120054 bajty 7403 bajty 5052 bajty
17
Grafika wektorowa
Grafika wektorowa
W przeciwieństwie do tradycyjnej grafiki
W przeciwieństwie do tradycyjnej grafiki
bitmapowej (opierającej się na zapamiętywaniu
bitmapowej (opierającej się na zapamiętywaniu
koloru i położenia pojedynczych pikseli), grafika
koloru i położenia pojedynczych pikseli), grafika
wektorowa zachowuje informacje o
wektorowa zachowuje informacje o
tworzÄ…cych dany obraz obiektach takich jak
tworzÄ…cych dany obraz obiektach takich jak
linie, obszary, etykiety itp. oraz uwzględnia
linie, obszary, etykiety itp. oraz uwzględnia
ich położenie oraz kolor.
ich położenie oraz kolor.
Zaletą takiego podejścia jest stała jakość
Zaletą takiego podejścia jest stała jakość
obrazu niezależnie od tego, w jakiej skali
obrazu niezależnie od tego, w jakiej skali
zostanie on wyświetlony oraz w porównaniu ze
zostanie on wyświetlony oraz w porównaniu ze
standardowymi formatami (JPEG, GIF, BMP)
standardowymi formatami (JPEG, GIF, BMP)
mniejsza wielkość plików
mniejsza wielkość plików
Grafika wektorowa
Grafika wektorowa
Poszczególne obiekty można modyfikować
Poszczególne obiekty można modyfikować
niezależnie od pozostałych, mogą się
niezależnie od pozostałych, mogą się
wzajemnie przesłaniać lub przenikać
wzajemnie przesłaniać lub przenikać
Nie nadaje siÄ™ raczej do przedstawiania
Nie nadaje siÄ™ raczej do przedstawiania
realnej rzeczywistości (duża złożoność
realnej rzeczywistości (duża złożoność
obrazów rzeczywistych jest przyczyną tworzenia
obrazów rzeczywistych jest przyczyną tworzenia
ogromnej ilości obiektów których obsługa
ogromnej ilości obiektów których obsługa
zajmuje wiele czasu i pamięci komputera).
zajmuje wiele czasu i pamięci komputera).
Obraz przedstawiany na urzÄ…dzeniu (monitor,
Obraz przedstawiany na urzÄ…dzeniu (monitor,
ploter) jest  kreślony element po elemencie
ploter) jest  kreślony element po elemencie
(efekt widoczny przy bardzo skomplikowanych
(efekt widoczny przy bardzo skomplikowanych
rysunkach lub przy wolnych komputerach)
rysunkach lub przy wolnych komputerach)
18
Formaty zapisu grafiki wektorowej
Formaty zapisu grafiki wektorowej
Formaty publicznie dostępne i przenośne:
Formaty publicznie dostępne i przenośne:
.cgm (Computer Graphics Metafile) - dwuwymiarowy.
.cgm (Computer Graphics Metafile) - dwuwymiarowy.
.ps (Adobe PostScript) - wektorowy opis postaci strony
.ps (Adobe PostScript) - wektorowy opis postaci strony
.dgn (AutoCAD) - obiekty trójwymiarowe.
.dgn (AutoCAD) - obiekty trójwymiarowe.
.svg (Scalable Vector Graphics) - dwuwymiarowy.
.svg (Scalable Vector Graphics) - dwuwymiarowy.
Formaty zapisu poszczególnych aplikacji
Formaty zapisu poszczególnych aplikacji
użytkowych, np.:
użytkowych, np.:
.cdr (Corel Draw!),
.cdr (Corel Draw!),
.sda (Sun StarDraw),
.sda (Sun StarDraw),
.wmf (Windows Meta File).
.wmf (Windows Meta File).
Digitalizacja (Rasteryzacja)
Digitalizacja (Rasteryzacja)
Termin ten oznacza przekształcenie obrazka
Termin ten oznacza przekształcenie obrazka
wektorowego w rastrowy. Uproszczony
wektorowego w rastrowy. Uproszczony
algorytm przekształcenia:
algorytm przekształcenia:
Nałóż siatkę kwadratów na rysunek wektorowy.
Nałóż siatkę kwadratów na rysunek wektorowy.
Rozmiar siatki (wysokość i szerokość) dostosuj do
Rozmiar siatki (wysokość i szerokość) dostosuj do
wymaganej rozdzielczości obrazka rastrowego
wymaganej rozdzielczości obrazka rastrowego
Przyporządkuj każdemu kwadratowi utworzonej siatki
Przyporządkuj każdemu kwadratowi utworzonej siatki
dominujÄ…cy w rozpatrywanym kwadracie kolor
dominujÄ…cy w rozpatrywanym kwadracie kolor
(rozstrzygnij sytuacje konfliktowe).
(rozstrzygnij sytuacje konfliktowe).
Zapamiętaj układ punktów barwnych (pikseli). Jeżeli
Zapamiętaj układ punktów barwnych (pikseli). Jeżeli
obraz docelowy charakteryzuje się mniejszą ilością
obraz docelowy charakteryzuje się mniejszą ilością
kolorów niż z
ródłowy dokonaj redukcji kolorów.
kolorów niż z
ródłowy dokonaj redukcji kolorów.
19
Wektoryzacja
Wektoryzacja
Termin ten oznacza przekształcenie obrazka
Termin ten oznacza przekształcenie obrazka
rastrowego w wektorowy. Jest to operacja
rastrowego w wektorowy. Jest to operacja
bardzo trudna. Przybliżony algorytm możemy
bardzo trudna. Przybliżony algorytm możemy
zapisać następująco:
zapisać następująco:
W układzie barw na siatce jednobarwnych
W układzie barw na siatce jednobarwnych
kwadratów rozpoznaj przebiegające linie, okręgi,
kwadratów rozpoznaj przebiegające linie, okręgi,
litery i inne znaki, obszary jednobarwne i ich
litery i inne znaki, obszary jednobarwne i ich
brzegi.
brzegi.
Zapamiętaj parametry zidentyfikowanych
Zapamiętaj parametry zidentyfikowanych
obiektów.
obiektów.
Zapisz uzyskane informacje w jednym z
Zapisz uzyskane informacje w jednym z
możliwych standardów opisu grafiki wektorowej.
możliwych standardów opisu grafiki wektorowej.
Animacja
Animacja
Niektóre formaty graficzne (np. gif) pozwalają
Niektóre formaty graficzne (np. gif) pozwalają
na umieszczanie w pojedynczym pliku wielu
na umieszczanie w pojedynczym pliku wielu
 klatek , które oglądane kolejno stwarzają
 klatek , które oglądane kolejno stwarzają
wrażenie ruchu.
wrażenie ruchu.
W typowej animacji kolejne klatki sÄ… do siebie
W typowej animacji kolejne klatki sÄ… do siebie
bardzo podobne, co można wykorzystać w
bardzo podobne, co można wykorzystać w
odpowiedniej metodzie kompresji danych.
odpowiedniej metodzie kompresji danych.
Dlatego w animacji korzysta siÄ™ ze specjalnych
Dlatego w animacji korzysta siÄ™ ze specjalnych
formatów zapisu obrazu, takich jak mpeg i avi
formatów zapisu obrazu, takich jak mpeg i avi
Animacja jest najbardziej zaawansowanÄ…
Animacja jest najbardziej zaawansowanÄ…
technikÄ… wykorzystania grafiki komputerowej,
technikÄ… wykorzystania grafiki komputerowej,
we współczesnych systemach nierozerwalnie
we współczesnych systemach nierozerwalnie
związana z grafiką trójwymiarową (3D)
związana z grafiką trójwymiarową (3D)
20
Opis standardu BMP
Opis standardu BMP
Na poczÄ…tku pliku w formacie BMP umieszczony
Na poczÄ…tku pliku w formacie BMP umieszczony
jest Blok informacyjny (nagłówek pliku). W
jest Blok informacyjny (nagłówek pliku). W
bloku tym zapisane są informacje, bez których
bloku tym zapisane są informacje, bez których
poprawne odczytanie obrazu byłoby niemożliwe.
poprawne odczytanie obrazu byłoby niemożliwe.
Następnie zapisany jest tzw. Blok palety. W
Następnie zapisany jest tzw. Blok palety. W
bloku tym zapisana jest paleta kolorów
bloku tym zapisana jest paleta kolorów
określająca nasycenie podstawowych barw
określająca nasycenie podstawowych barw
(RGB). PoczÄ…tek bloku palety jest w 54 bajcie
(RGB). PoczÄ…tek bloku palety jest w 54 bajcie
pliku. Struktura bloku palety nie jest
pliku. Struktura bloku palety nie jest
skomplikowana. Wygląd kolejnych kolorów
skomplikowana. Wygląd kolejnych kolorów
(0,1,2,3...) zapisany jest jako sekwencja
(0,1,2,3...) zapisany jest jako sekwencja
czwórek bajtów określających nasycenie każdej
czwórek bajtów określających nasycenie każdej
ze składowych RGB (czwarty bajt zawiera
ze składowych RGB (czwarty bajt zawiera
informacje dla wersji monochromatycznych)
informacje dla wersji monochromatycznych)
Opis standardu BMP
Opis standardu BMP
Po Bloku palety następuje Blok obrazu. Jak
Po Bloku palety następuje Blok obrazu. Jak
łatwo się domyślić w bloku tym zapisany jest
łatwo się domyślić w bloku tym zapisany jest
obraz. Zapisano go w trochÄ™ niekonwencjonalny
obraz. Zapisano go w trochÄ™ niekonwencjonalny
sposób. Obraz opisany jest nie z góry do dołu,
sposób. Obraz opisany jest nie z góry do dołu,
ale z dołu do góry (jako pierwsza w pliku
ale z dołu do góry (jako pierwsza w pliku
zdefiniowana jest ostatnia linia obrazu). Choć
zdefiniowana jest ostatnia linia obrazu). Choć
standard BMP mówi, iż zapisany w tym formacie
standard BMP mówi, iż zapisany w tym formacie
obraz może być skompresowany, nie jest to
obraz może być skompresowany, nie jest to
powszechnie wykorzystywana funkcja w plikach
powszechnie wykorzystywana funkcja w plikach
typu BMP (czyli sposób kompresji dla pliku
typu BMP (czyli sposób kompresji dla pliku
będzie określony jako = 0  pozycja 10 w tabeli
będzie określony jako = 0  pozycja 10 w tabeli
opisu nagłówka na następnym slajdzie).
opisu nagłówka na następnym slajdzie).
21
Opis nagłówka pliku standardu BMP
Opis nagłówka pliku standardu BMP
Offset Pole Rozmiar Zawartość
0000h Identifier 2 bajty Identyfikator platformy:
 BM - Windows 3.1x, 95, NT, &
 BA - OS/2 Bitmap Array
 CI - OS/2 Color Icon
 CP - OS/2 Color Pointer
 IC - OS/2 Icon
 PT - OS/2 Pointer
0002h File Size 4 bajty Całkowity rozmiar pliku
0006h Reserved 4 bajty Zarezerwowane
000Ah Bitmap Data 4 bajty Przesunięcie początku danych graficznych względem
Offset poczÄ…tku pliku
000Eh Bitmap 4 bajty Rozmiar nagłówka pliku:
Header Size 28h - Windows 3.1x, 95, NT, &
0Ch - OS/2 1.x
F0h - OS/2 2.x
0012h Width 4 bajty Szerokość obrazu (w pikselach)
0016h Height 4 bajty Wysokość obrazu (w pikselach)
001Ah Planes 2 bajty Liczba bit-planów
Opis nagłówka pliku standardu BMP
Opis nagłówka pliku standardu BMP
Offset Pole Rozmiar Zawartość
001Ch Bits Per Pixel 2 bajty Ilość bitów tworzących piksel:
1 - Monochrome bitmap
4 - 16 color bitmap
8 - 256 color bitmap
16 - 16bit (high color) bitmap
24 - 24bit (true color) bitmap
32 - 32bit (true color) bitmap
001Eh Compression 4 bajty Sposób kompresji:
0  brak
1 - RLE 8-bit / pixel (BI_RLE8)
2 - RLE 4-bit / pixel (BI_RLE4)
3 - Bitfields (BI_BITFIELDS)
0022h Bitmap Data 4 bajty Rozmiar obrazu (zaokrąglony do wielokrotności 4 bajtów)
Size
0026h HResolution 4 bajty Ilość X pikseli na metr (używane przy kompresji)
002Ah VResolution 4 bajty Ilość Y pikseli na metr (używane przy kompresji)
002Eh Colors 4 bajty Ilość kolorów istniejącej palety
0032h Important 4 bajty Ilość najważniejszych kolorów w palecie (równa ilości
Colors kolorów jeżeli wszystkie są ważne)
0036h Palette N * 4 bajty Specyfikacja palety: Każdy wpis palety to 4 bajty
określające kolejno składowe (niebieską, zieloną,
czerwoną, bajt przezroczystości lub luminancja dla
ekranów monochromatycznych)
0436h Bitmap Data x bajtów Dane obrazka
22