Vektororientierte Grafikbearbeitung Stefan K. Baur 4. Semester Medien und Design Prof. Dr. Burkhard Freitag Betreuer: Dipl.-Inf. Christian Süß

Vektororientierte Grafikbearbeitung Gliederung: Proseminar Vektororientierte Grafikbearbeitung Was sind Vektorgrafiken und wofür? Grundlagen: Vektorrechnung Vektororientierte Grafikelemente Vektororientierte Grafikformate Präsentation: Pseudo-Code -> FreeHand

Vektororientierte Grafikbearbeitung Was sind Vektorgrafiken? Vektororientierte Grafikbearbeitung Symbol-Charakter! Pfeile und Buttons im Web... Schema-Charakter! Pläne für Häuser oder Anlagen! UML-Modellierung... Vektorgrafiken entstehen immer aus Vorschriften Aus konkreten Befehlen und Objekten Vektororientierte Grafik = Objektorientierte Grafik

Vektororientierte Grafikbearbeitung Wofür eigentlich Vektorgrafik? Vektororientierte Grafikbearbeitung leichter automatisch erstellt werden Vektor-Grafiken in Abhängigkeit der Uhrzeit oder Datum Vektor-Grafiken können leichter korrigiert werden können leichter manuell bearbeitet werden Skizzen können leichter nachbearbeitet werden Vektorisierung: Rasterformat -> Vektorformat

Vektororientierte Grafikbearbeitung Komprimierungsmöglichkeit Vektororientierte Grafikbearbeitung Rastergrafiken speichern für jedes ihrer Pixel einen Farbwert ab. Vektorgrafiken speichern ihre Objektinformationen ab. Lösung: Vektorisierung Rastergrafik Vektorgrafik Konvertierung Im Normalfall erlangt man eine kleinere Datei!

Vektororientierte Grafikbearbeitung Vektorisierung Vektororientierte Grafikbearbeitung Pixelgrafik Vektorgrafik

Vektororientierte Grafikbearbeitung Gegenüberstellung Vektororientierte Grafikbearbeitung Rasterformat Vektorformat Dimensionsabhängiger Speicherbedarf Bildgröße hat keinen Einfluß auf die Speichergröße Qualitätsverlust bei Skalierung (z.B. vergrößern) Beliebig skalierbar ohne Verlußt der Qualität Photoqualität kaum realiserbar Photoqualität leicht realiserbar Grundlage für Präsentationsprogramme

Vektororientierte Grafikbearbeitung Gliederung: Vektorrechnung Vektororientierte Grafikbearbeitung Betrag eines Vektors Vektoraddition Multiplikation mit einem Skalar Skalarmultiplikation Multiplikation mit einer Matrix Vektor-Abbildung (allg.) Das Kreuzprodukt (2D, 3D)

Vektororientierte Grafikbearbeitung Betrag eines Vektors Vektororientierte Grafikbearbeitung Verwendungszweck: Abstandsberechnung zweier Bildpunkte oder Objekte Realisierung:

Vektororientierte Grafikbearbeitung Vektoraddition Vektororientierte Grafikbearbeitung A B Verwendungszweck: Translation eines Bildpunktes oder Objekts Realisierung:

Vektororientierte Grafikbearbeitung Multiplikation mit einem Skalar Vektororientierte Grafikbearbeitung Verwendungszweck: Vergrößern oder Verkleinern eines Grafikobjekts Realisierung:

Vektororientierte Grafikbearbeitung Skalarmultiplikation Vektororientierte Grafikbearbeitung Verwendungszweck: Grundlage für die Multiplikation mit einer Matrix Bestimmung des Winkels zwischen zwei Vektoren Realisierung:

Vektororientierte Grafikbearbeitung Multiplikation mit einer Matrix Vektororientierte Grafikbearbeitung Verwendungszweck: Grundlage für lineare Abbildungen in V² Realisierung:

Vektororientierte Grafikbearbeitung Vektor-Abbildung (allg.) Vektororientierte Grafikbearbeitung Beispiele: Translation Drehung Spiegelung Streckungsabbildung

Vektororientierte Grafikbearbeitung Das Kreuzprodukt Vektororientierte Grafikbearbeitung Verwendungszweck: Grundlage für 3D-Grafik, die Normale zu Vektoren Hier Fläche eines Parallelogramms Realisierung:

Vektororientierte Grafikbearbeitung Gliederung: VO - Grafikelemente Vektororientierte Grafikbearbeitung Primitive Strecken bzw. Geraden Polygon Rechtecke Ellipsen Kurven Bezier Casteljau Bernstein

Vektororientierte Grafikbearbeitung Strecke bzw. Gerade Vektororientierte Grafikbearbeitung Beschreibungsform: Eine Strecke definiert man am Besten mit zwei Vektoren O Eine Gerade definiert man am Besten als Abbildung O

Vektororientierte Grafikbearbeitung Polygon Vektororientierte Grafikbearbeitung Beschreibungsform: Verkettung von n - Strecken Strecke n Strecke 1 Strecke 2 ... O Nachteil: Speicherintensiv für große Polygone

Vektororientierte Grafikbearbeitung Rechteck Vektororientierte Grafikbearbeitung Beschreibungsform: 1. Als Spezialform des Polygons O 2. Eine Spezialform eines Paralellogramms mit zwei Vektoren

Vektororientierte Grafikbearbeitung Ellipse Vektororientierte Grafikbearbeitung Beschreibungsform: 1. Als Spezialform des Polygons mit sehr kleinen Strecken, aber auch sehr vielen Strecken O 2. Darstellung mit einer Funktion

Vektororientierte Grafikbearbeitung Bezier Vektororientierte Grafikbearbeitung Wie kann man nun beliebige Formen beschreiben? Mit Polygonen! Mit Funktionen! Nach Bezier funktioniert das sehr gut!

Vektororientierte Grafikbearbeitung Bezier Vektororientierte Grafikbearbeitung Das Prinzip von Bezier: Verwende das Prinzip der Polygone im Zusammenhang mit Funktionen, so dass die Kurve Gummiband-Charakter hat.

Vektororientierte Grafikbearbeitung Casteljau Vektororientierte Grafikbearbeitung Realisierung von Bezier-Kurven: Rekursive Lösung Casteljau hüllt die resultierende Kurve mit einem Polygon ein.

Vektororientierte Grafikbearbeitung Bernstein Vektororientierte Grafikbearbeitung Realisierung von Bezier-Kurven: Iterative Lösung Die Punkte des Polygons sind die Leitpunkte, mit denen man die Zugkraft auf den nächsten Punkt der Kurve mittels Gewichtsfunktion berechnen kann.

Vektororientierte Grafikbearbeitung Pseudo-Code Vektororientierte Grafikbearbeitung

Vektororientierte Grafikbearbeitung Gliederung: Grafikformate Vektororientierte Grafikbearbeitung Das Format: ps Das Format: eps Das Format: pdf Das Format: svg

Vektororientierte Grafikbearbeitung Das Format: ps Vektororientierte Grafikbearbeitung PS = PostScript = Seitenbeschreibungssprache Level-1-Postscript (80er Jahre) Level-2-Postscript (heute) Basissatz von Primitiven Beschränkt skalierbare Fonts (10pt u. 12pt) Ermöglicht modulare Programmierung Erweiterung von Level-1-Postscript Bessere Speicherverwaltung für den Interpreter Höhere Anzahl von Primitiven Beliebig skalierbare Fonts komplettes Farbkonzept (geräte- bzw. geräteunabhängig)

Vektororientierte Grafikbearbeitung Das Format: eps Vektororientierte Grafikbearbeitung EPS = Encapsulated PostScript Restriktion von Postscript: Stellt nur ein Bild dar Beginnen mit einem Kommentar z.B. Autor und Version Das EPS-Bild kann von Anwendungsprogrammen gelesen werden, die kein Postscript beherschen! Vorteil:

Vektororientierte Grafikbearbeitung Das Format: pdf Vektororientierte Grafikbearbeitung PDF = Portable Document File Sehr viel von Level-2-Postscript übernommen Zeichnet sich durch bessere Komprimierung aus Vorteil:

Vektororientierte Grafikbearbeitung Das Format: svg Vektororientierte Grafikbearbeitung SVG = Scalable Vector Graphics SVG-Grafiken wurden für das Internet konzepiert Besonders für XML

Vektororientierte Grafikbearbeitung Praxis Vektororientierte Grafikbearbeitung Praxis Pseudo-Code + FreeHand