Original 400 fache Vergrößerung 1600 fache Vergrößerung

Bitmap-Grafik: Bild mit Hilfe eines Rasters von Punkten beschreiben Eine Bitmapgrafik kann gut mit einem Mosaik verglichen werden. Ein Mosaik besteht aus vielen kleinen, farbigen Steinchen, welche zusammen ein ganzes Bild ergeben. Bei einer Bitmap auf dem Computer entsprechen die einzelnen Steinchen sogenannten Pixeln. Der einzige Unterschied ist, dass die Pixel einer Bitmapgrafik alle gleich gross und quadratisch sind.

Die einzelnen Pixel sind im Normalfall nicht sichtbar. Vergrössert man das Bild aber stark genug, so kann man die Aufteilung des Bildes in Pixel deutlich erkennen. Sind die einzelnen Pixel in einem Bitmap klein genug, dann verschmelzen sie zu einem ganzen Bild, ohne dass wir in der Lage sind die einzelnen Bildpunkte wahrzunehmen. Einen ähnlichen Effekt erhalten wir bei einem Mosaik, wenn wir es aus einer gewissen Distanz betrachten. Wir erkennen dann auch nicht mehr die einzelnen Steinchen, sondern nur noch ein ganzes Bild.

Dieser Begriff setzt sich zusammen aus: Bilder, die sich aus vielen kleinen Bildpunkten zusammensetzen, nennt man: Pixelgrafiken Dieser Begriff setzt sich zusammen aus: Picture und Elements = Pixel In Pixelgrafiken enthält jeder Punkt die Bild-information.

Pixelgrafik Monitor Foto Scanner Drucker auch hier setzen sich die Bilder aus kleinen Bildpunkten ( Pixeln ) zusammen.

Nicht jede Grafik ist eine Pixelgrafik: Frosch.cdr Frosch.bmp Pixelgrafik Dateigröße: 32 KB Dateigröße: 1359 KB Skalierbar ohne Qualitäts- verlust mit großem Qualitäts-

Woran liegt das ?

Beispiel: Kreis und Linie Bei dieser Grafik sieht man deutlich den punktweisen Aufbau und den damit verbundenen Treppchen- effekt. Es gibt jedoch noch eine andere Methode, Grafikinformationen abzuspeichern:

Grafikformate - Vergleich Linie als Bitmap Line als Vektorgrafik Vergleicht man die die beiden Linien, so sieht man dass bei der Vergrösserung Unterschiede bestehen. Bei der Linie, welche als Bitmap gespeichert wurde, werden die einzelnen Pixel deutlich sichtbar. Bei der Vektorgrafik hingegen bleibt die Linie auch vergrössert sauber bestehen.

Vektorgrafik: Bild in geometrische Objekte unterteilen 7,5 cm 5 cm 4 cm Kreis: Mittelpunkt: (7,5 : 5) Radius: 4 Farbe: Dunkelrot Stärke: 0,2 Füllung: Gold Der Kreis wird gespeichert, indem alle zum Zeichnen wichtigen Werte gespeichert werden.

Bitmaps Vektorgrafiken Anwendungs-bereiche Vorteile Nachteile Photos Grafiken mit weichen Farbübergängen Internetbilder technische Zeichnungen Schriftzüge Druckvorlagen Anwendungs-bereiche Einfach editierbar werden von fast allen Grafikprogrammen unterstützt Keine Qualitätseinbussen bei Änderung der Bildgrösse Vorteile Nachteile nur mit spezifischen Programmen editierbar;

Die Vektorgrafik 200 300 400 500 100 Einheiten Bei Vektorgrafiken wird der Bildschirm mit einem unsichtbaren Koordinatensystem überzogen. [Strecke, grün, A=(100/50), E=(350/100)] (350/100) E (100/50) A Die Linie wird lediglich durch den Anfangspunkt A und den Endpunkt E im Koordinatensystem festgelegt. Das System merkt sich nur, dass es sich um eine Strecke handelt, dass diese grün ist und den Anfangs- und den Endpunkt der Strecke.

Die Vektorgrafik Der Kreis: [Kreis, blau, M=(250/200), r=80 ] 300 400 500 100 Einheiten Der Kreis: [Kreis, blau, M=(250/200), r=80 ] (250/200) M r(80) Hier merkt sich das System lediglich,dass es sich um einen Kreis handelt, dass dieser blau ist, wo sein Mittelpunkt liegt und welchen Radius er hat.

Die Vektorgrafik 200 300 400 500 100 Einheiten Geordnete Auflistungen von Informationen nennt man Vektoren r(80) (250/200) M E A (350/100) (100/50) [Kreis, blau, M=(250/200), r=80 ] [Strecke, grün, A=(100/50), E=(350/100)]

Speicherplatzbedarf Vektorgrafik Pixelgrafik gering: hoch: die gesamte Grafikinformation ist als Vektor ge-speichert jeder einzelne Pixel enthält die Grafikinformation

Skalierung (Vergrößerung): Vektorgrafik Pixelgrafik frei skalierbar: ohne Qualitätsverlust Skalierung: nur mit Qualitätsverlust glatte, scharfe Kanten unscharfe Bilder, Treppchenbildung

Nachbearbeitung Vektorgrafik Pixelgrafik begrenzt: unbegrenzt: nur ganze Unterobjekte lassen sich bearbeiten jeder einzelne Pixel lässt sich bearbeiten

Eignung Vektorgrafik Pixelgrafik für: für: Konstruktions-zeichnungen Fotos Malen Schriften (True Types) Nachbearbeitung Clip - Arts Stadtpläne

Zeichen- u. Konstruktions-programme Zusammenfassung Vektorprogramme Pixelprogramme Zeichen- u. Konstruktions-programme Mal- u. Foto-programme

Vektorgrafikprogramme Pixelgrafikprogramme

Speicherung von Informationen Von Bits und Bytes : Speicherung von Informationen

Speicherung von Informationen Für jede Information wird im Speicher des Computers Speicherplatz reserviert. Es gibt nur zwei Möglichkeiten. Entweder der Stromkreis wird geschlossen oder nicht: an oder aus ja oder nein 0 oder 1 Folglich ist das binäre Zahlensystem zum Speichern von Informationen am besten geeignet: Es gibt also nur 2 Ziffern: 0 und 1 (Vergleich: Beim dezimalen Zahlensystem sind es 10 Ziffern: 0, 1, 2, ...9.) Alle Zahlen des Dezimalsystems lassen sich auch im binären Zahlensystem darstellen.

Die kleinste Speichereinheit nennt man 1 Bit: Speicherung von Informationen Die kleinste Speichereinheit nennt man 1 Bit: 1 Bit = 21 1 2 Bit = 22 00 01 10 11 2 Zustände (einstellig) bzw. 2 Möglichkeiten Informationen zu speichern 4 Zustände (zweistellig)

4 Bit = 24 16 Zustände Speicherung von Informationen binär dez. 0000 0 0000 0 0001 1 0010 2 0011 3 0100 4 0101 5 0110 6 0111 7 1000 8 1001 9 1010 10 1011 11 1100 12 1101 13 1110 14 1111 15 binär dez. 4 Bit = 24 16 Zustände

8 Bit = 1 Byte 256 Zustände 8 Bit = 28 Speicherung von Informationen 0000 0000 0 0000 0001 1 0000 0010 2 0000 0011 3 0000 1000 4 ............ .... 1111 1010 250 1111 1011 251 1111 1100 252 1111 1101 253 1111 1110 254 1111 1111 255 binär dez. 256 Zustände 8 Bit = 28 Das Wort „Byte“ setzt sich zusammen aus den Wörtern „Bit“ und „eight“ (engl.: 8). 8 Bit = 1 Byte

Speicherplatz pro Pixel in einem Bild: 1 Bit = 21 2 Bit = 22 4 Bit = 24 1 Bit 2 Bit 4 Bit 2 Zustände: schwarz u. weiß 4 Zustände; also 4 Farben 16 Farben

Beispiele: 16 Farben=4 Bit jpg 16 Mio. Farben 256 Farben=8 Bit

das bedeutet: Mit 8 Bit = 256 Farben lassen sich keine fotorealistischen Bilder aufbauen (Gif als Format ist demnach für Fotos ungeeignet.) man benötigt mindestens: 16 Bit = 65 Tausend Farben besser: 24 Bit = 16 Millionen Farben oder: 32 Bit = 4,3 Milliarden Farben Eine hohe Bildqualität beinhaltet: möglichst viele Farben pro Pixel und möglichst kleine Pixel, also viele Pixel pro Bild

Grafikformate - Farbtiefe Farbübergänge 2 Farben (1 Bit) 16 Farben (4 Bit) Der Einfluss der Anzahl verwendeter Farben wird vor allem dann gut sichtbar, wenn Farbübergänge dargestellt werden sollen. Allerdings wurden die oberen drei Bilder ohne Fehler-Diffusion erstellt. Bei der Fehlerdiffusion werden Farbübergänge bei der Reduktion der Farben besser dargestellt. Dies geschieht mit Hilfe eines Algorithmus, der bei der Bestimmung der Substitutionsfarbe auch umliegende Pixel miteinbezieht. 256 Farben (8 Bit) 16.7 Millionen Farben (24 Bit)

Die Anzahl der Bits pro Bildpunkt (Pixel) bezeichnet man als Farbtiefe Die Anzahl der Bits pro Bildpunkt (Pixel) bezeichnet man als Farbtiefe Die Farbtiefe von 24 Bit wird auch True Color (24-Bit) genannt. In der Systemsteuerung lässt sie sich für den Monitor einstellen.

Die Anzahl der Bildpunkte pro Zoll nennt man Auflösung Sie wird unterschiedlich angegeben: dpi = dots per inch (Drucker) ppi = pixel per inch (Bildschirm) manchmal auch als: lpi = line per inch

Rechenbeispiel Beispiel: Ein 17 Zoll Monitor mit einer Einstellung von 1024 x 768 Pixel hat in der Breite also 1024 und in der Höhe 768 Pixel Mein Monitor hat eine tatsächliche Bildbreite von 32 cm 2,54 cm = 1 inch 32 cm = 12,6 inch Die Auflösung von meinem Bildschirm beträgt dann: 1024 / 12,6 = 81 dpi

43 Mio. x 16 Mio. = 6,88 · 1014 Farbinformationen gespeichert. Rechenbeispiel 2. Beispiel: Ein Bild hat eine Größe 32 x 24 cm und eine Auflösung 600 dpi 1 inch  600 Pixel Breite: 32 cm = 12,6 inch 12,6 inch x 600 pixel/inch  7560 Pixel Höhe: 24 cm = 9,4 inch 9,4 inch x 600 pixel/inch  5640 Pixel Das sind insgesamt: 7560 x 5640 = 42,64 Mio. Pixel Bei einer Farbtiefe von 24 Bit (= 16 Mio. Farben pro Pixel ) sind in dem Bild insgesamt: 43 Mio. x 16 Mio. = 6,88 · 1014 Farbinformationen gespeichert. Größe der Dateien: 20 MB und mehr

...und das kostet Speicherplatz Zusammenfassung Um ein qualitativ gutes Bild darzustellen, benötigt man eine hohe Farbtiefe und eine hohe Auflösung folglich: riesige Mengen an Grafikinformationen ...und das kostet Speicherplatz

.tif .gif Grafikformate .bmp .png .jpg

Methode: Datenkomprimierung Grafikformate Hohe Farbtiefe und hohe Auflösung hohe Qualität hoher Speicherplatzbedarf Methode: Datenkomprimierung ohne wesentlichen Informationsverlust allerdings mit Qualitätseinbußen dieser Vorgang ist irreversibel die Art der Komprimierung ist abhängig vom Grafikformat

Windows-Bitmap Beim Abspeichern von Bilddateien lassen sich die verschiedenen Grafikformate auswählen: Grafikformate erkennt man an der Erweiterung des Dateinamens Krokus.bmp Windows Bitmap - Datei

Windows-Bitmap Beim Abspeichern von Bilddateien lassen sich die verschiedenen Grafikformate auswählen Grafikformate erkennt man an der Erweiterung des Dateinamens Krokus.bmp Windows Bitmap - Datei jedoch bei *.bmp - Dateien: keine Datenkompression jeder Bildpunkt wird abgespeichert beste Bildqualität jedoch hoher Speicherplatzbedarf

Krokus.bmp 3.601 KB Beispiel:

Grafikformate Die wichtigsten Grafikformate: *.bmp = Windows Bitmap *.tif (tiff)= Tagged Image File Format *.jpg (jpeg) = Joint Photographics Experts Group *.gif = Graphics Interchange Format *.png = Portable Network Graphics

Krokus.bmp 3.601 KB Krokus.jpg 16 KB

stark vergrößert stark vergrößert Krokus.jpg 16 KB Krokus.jpg 50 KB Krokus.bmp 3601 KB stark vergrößert Krokus.jpg 106 KB stark vergrößert Krokus.jpg 106 KB

Komprimierung BMP GIF JPG TIF ja Grad nicht wählbar ja oder nein nicht möglich frei wählbar

(bzw. Anzahl der Farben) Komprimierungsgrad BMP GIF JPG TIF vom Bild abhängig (bzw. Anzahl der Farben) niedrig bis hoch relativ hoch -----

Ja, je nach Kom-primierung Informationsverlust BMP GIF JPG TIF Ja, je nach Kom-primierung ----- keiner keiner

Farbtiefe BMP GIF JPG TIF 32 Bit 8 Bit 24 Bit

Verwendung BMP GIF JPG TIF Für Linien und Motive mit klaren Konturen und wenig Farben 1 Trans-parenzfarbe (Alphakanal) Fotos u. Illustrationen in Echtfarben nicht: für Zeichnungen u. Schriftzüge mit starken Kontrasten Desktop (Hinter-grundbilder) Fotos u. Illustrationen Fotos u. Illustrationen in Echtfarben

WEB - Seiten BMP GIF JPG TIF geeignet: geringe Datei-größe geeignet: nicht geeignet nicht geeignet

Grafikformate Format Anzahl Farben Kompression Anwendung Windows Bilder keine 2,6,256,16 Mio BMP gescannte Bilder gering Maximal 16 Mio TIFF Text als Grafik, Strich-zeichnungen, WWW gering, verlustfrei Maximal 256 GIF Fotos und Bilder mit weichen Farbverläufen, WWW hoch, mehr oder weniger verlustbehaftet Maximal 16 Mio JPEG alle Bilder hoch, verlustfrei Maximal 16 Mio PNG

Quellen http://www.ihreexperten.de/uploads/media/Bildbearbeitung.pdf Bildbearbeitung.ppt von Gisela König http://www.swisseduc.ch/informatik/vortraege/grafikformate/ (Markus Braendle: folien.ppt) http://www.swisseduc.ch/informatik/material/grafikformate/docs/vortrag_bildformate.ppt (Beat Döbeli Honegger)