Grafika 2

17
GRAFIKA – 2. DIO Kolegij: Multimedijski sustavi Nositelj kolegija: Nataša Hoić-Božić Autor: Jan Božić

Transcript of Grafika 2

Page 1: Grafika   2

GRAFIKA – 2. DIOKolegij: Multimedijski sustavi

Nositelj kolegija: Nataša Hoić-Božić

Autor: Jan Božić

Page 2: Grafika   2

Bitmape (1)

• Najstariji i najkorišteniji način prikaza slike

• Opis slike vrši se pomoću niza pojedinačnih točkica – piksela na rasteru, odnosno mapi bitova

• Mape su 2D matrice u čija su polja pohranjeni pikseli

• Raster označava nešto što je načinjeno od više elemenata u nekom vidljivom 2D sustavu

Page 3: Grafika   2

Bitmape (2)

• Drugo ime za bitmape – rasterska grafika

• Crtanje pomoću mozaika piksela pri čemu svaki piksel zasebno nosi informaciju o boji koju reporducira

• Dva elementa koji definiraju bitmapu:

• Rezolucija slike

• Dubina slike

Page 4: Grafika   2

Rezolucija slike

• Opisuje se kao gustoća piksela po jednici duljine (broj točaka po inču)

• Računa se kao: visina x širina

• DPI – gustoća piksela

• Najčešće rezolucije: 800x600, 1024x768, 1680x1050, 1920x1080

• Izračun veličine: veličina = rezolucija / gustoća piksela

Page 5: Grafika   2

Dubina slike

• Broj bitova koji se koriste za opis slike

• Piksel – izražen kao količina R, G i B boje

• Postoje:

• Monokromatska ili crno-bijela slike

• Svaki piksel 0 ili 1 bit

• Slika u tonovima sive boje (gray-scale)

• Svaki piksel 8 bita, samo tonovi sive

• Slika u 8-bitnoj boji

• Pikseli sadrže podatak o boji

• Slika u 24-bitnoj boji

• Piksel je spremljen kao 3 bajta

Page 6: Grafika   2

Sažimanje (1)

• Kopresija – proces kodiranja koji reducira broj bitova potreban za prikaz podataka

• Sažimanje vrši koder, a vraća u nesažeti oblik dekoder

Page 7: Grafika   2

Sažimanje (2)

• Najveća primjena kod grafike, zvuka i videa

• Algoritmi za sažimanje

• Sažimanje bez gubitaka informacija

• Sažimanje s gubitkom informacija

Page 8: Grafika   2

Sažimanje slika

• Sve standardne tehnike sažimanja temelje se na načelu redundantnosti

• Redundantni podaci odnose se na:

• Redundanciju položaja

• Redundanciju vremena

• Standardni formati prikaza: GIF, PNG, JPEG

Page 9: Grafika   2

Kodiranje bez gubitaka

• RLE (kodiranje duljinom niza)

• Temelji se na smanjivanju dužine točaka koje se ponavljaju

• Prilično jednostavan algoritam

• Nije efikasan

• LZW metoda

• Najčešće korišteni

• Temelji se na metodi rječnika

• Slika se komprimira u niz uzoraka koji su ukupno manji po veličini od izvornika

Page 10: Grafika   2

Kodiranje s gubicima

• Komprimirana slika nije ista kao original, predstavljaju njezinu aproksimaciju koju čovjek percipira jednaku originalu

• Vrši se u tri faze:1. Transformacijsko kodiranje

2. Kvantizacija

3. Kodiranje

Page 11: Grafika   2

Formati datoteka sa slikama

• Temeljna podjela na bitmape i vektorsku grafiku

Page 12: Grafika   2

Formati za bitmape

• Windows Bitmap (BMP)

• Nekomprimiran format

• Zauzima puno mjesta

• Adobe Photoshop (PSD)

• Podržava sve dubine boja, slojeve, maske, alfa kanale, itd.

• Tagged Image File Format (TIFF)

• Spremanje svih dubina, spremanje u slojevina

• Optimiziran za tiskarske procese

• Format za spremanje skeniranih slika

Page 13: Grafika   2

GIF

• Prikazuje slike u 8-bitnoj boji

• Pogodan za ilustracije, ikone, logo, gumbe, itd.

• Komprimira bez gubitaka pomoću LZW algoritma

• Mogućnosti GIF-a:

1.Prozirnost

2.Postepeno učitavanje

3.Animacija

Page 14: Grafika   2

JPEG

• Radi sa 24-bitnom dubinom boja

• Pogodan za fotografije

• Koristi kompresiju sa gubitkom

• Nudi optimalan kompromis između veličine datoteke i njezine kvalitete

Page 15: Grafika   2

PNG

• Nastao kao zamjena za GIF

• Komprimira bez gubitaka

• Prednosti naprema GIF-u:

• Alfa kanali za promjenjivu prozirnost

• Gama korekcija

• 2D preplitanje

Page 16: Grafika   2

Formati vektorske grafike

• Windows Metafile (WMF)

• Pogodan za prijenos zbog kompatibilnosti

• Podržava samo najosnovnije boje prijelaza

• Encapsulased PostScript(EPS)

• Pogodan za ispis i pripremu za pisak

• Scalable Vector Graphics (SVG)

• Namijenjen za korištenje na webu

• Jezik za opisivanje 2-D grafike u XML-u

Page 17: Grafika   2

Grafika za Web

• Na webu možemo koristiti vektorsku grafiku i bitmap grafiku

• Boje mogu biti specificirane kao RGB trojka ili prema njihovim nazivima

• Sigurne web boje – boje koje ne uzrokuju dithering

• Dithering – proces u kojem se pokušava kreirati boja koja nije sadržana u paleti pomoću dostupnih boja paleta