Diana und Dominik - Uni Koblenz-Landaucg/ws1213/cg1/uebung/...tec&fea=BeautyPixelDeep Diana und...

Click here to load reader

  • date post

    05-Mar-2021
  • Category

    Documents

  • view

    2
  • download

    0

Embed Size (px)

Transcript of Diana und Dominik - Uni Koblenz-Landaucg/ws1213/cg1/uebung/...tec&fea=BeautyPixelDeep Diana und...

  • Wiederholung - Beleuchtung Texturen

    Übungsstunde 8 zu Computergrafik 1

    Diana und Dominik

    Institut für ComputervisualistikUniversität Koblenz

    14. und 15. Januar 2013

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Inhaltsverzeichnis

    1 Wiederholung - BeleuchtungGouraud-ShadingPhong-ShadingFlat-ShadingVergleich

    2 TexturenTexturen - IdeeTexturen in OpenGLTexturfilterungMipMaps

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Gouraud-Shading

    Gouraud-Shading

    Interpolieren der Farben

    Farben der Eckpunkte werden durch entsprechenden Normalenan den Eckpunkten berechnet.

    Fehlende Farbwerte werden durch bi-lineare Interpolation beider Scankonvertierung bestimmt.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Gouraud-Shading

    Gouraud-Shading

    Interpolieren der Farben

    Eckpunktnormale und Lichtvektor bestimmen Beleuchtung

    Nur die Eckpunkte werden wirklich korrekt beleuchtet, derRest nur interpoliert

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Phong-Shading

    Phong-Shading

    Interpolieren der Normalen

    Die Normalen der Eckpunkte werden komponentenweiseinterpoliert.

    Jedes Pixel wird mit seiner Normale beleuchtet.

    Nicht Standard OpenGL.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Phong-Shading

    Phong-Shading

    Interpolieren der Normalen

    Durch Interpolation der Normalen wird jedes Fragment einzelnbeleuchtet.

    Korrekterer Eindruck (weniger flächigerer Eindruck)

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Flat-Shading

    Flat-Shading

    Interpolieren der Normalen

    Nur Flächennormale wird benutzt

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Vergleich

    Abbildung: Von links nach rechts: Flat-Shading, Gouraud-Shading,Phong-Shading

    Quelle: http://www.ntsc-uk.com/feature.php?featuretype=tec&fea=BeautyPixelDeep

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

    http://www.ntsc-uk.com/feature.php?featuretype=tec&fea=BeautyPixelDeephttp://www.ntsc-uk.com/feature.php?featuretype=tec&fea=BeautyPixelDeep

  • Wiederholung - Beleuchtung Texturen

    Vergleich

    Abbildung: Von links nach rechts: Flat-Shading, Gouraud-Shading,Phong-Shading

    Quelle:http://www.hlc-games.de/forum/viewtopic.php?f=10&t=56

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

    http://www.hlc-games.de/forum/viewtopic.php?f=10&t=56

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Texturen in OpenGL

    Idee

    Eine Textur ist ein Bild, welches die Beschaffenheit vonOberflächen beschreiben kann.

    Eine Textur soll während der Rasterisierung auf ein Polygongemappt werden.

    Vorteile: Höherer Detaillierungsgrad möglich, Vereinfachungder Objekte.

    Möglich in 1D, 2D oder 3D.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Abbildung: Ohne und mit Textur

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Beispiel Ziegelsteinwand

    Ohne Texturen

    Besteht aus: Vielen unterschiedlich farbigen Steinen undFugen.

    Ohne Texturen müsste jeder Stein und die Fugen ausPolygonen erstellt werden.

    Jedem Stein müsste eine Farbe zugewisen werden.

    Ergebnis: Unnatürlich regelmäßige Wand und hoherRechenaufwand.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Beispiel Ziegelsteinwand

    Mit Texturen

    Ein einziges Polygon mit den Ausmaßen der Ziegelsteinwandwird erzeugt.

    Das Bild einer Ziegelsteinwand wird als Textur auf dasPolygon gemappt.

    Resultat: Natürlicher Eindruck und weniger Rechenaufwand,da nur ein einziges Objekt und eine Textur berechnet werdenmuss.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Abbildung: Ohne und mit Textur

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Texturkoordinaten

    Texturmapping

    Ein Textur-Element, welches auf ein Pixel gemappt wird nenntman Texel (Texture Element), analog zu Pixel.

    Während der Rasterisierung wird das entsprechende Texel zumPixel bestimmt.

    Das Textur-Bild wird in einem (s,t)-Koordinatensystemangegeben.

    Für jedes Pixel auf dem Bildschirm wird ein Texture Look-Updurchgeführt, um die Farbe des Pixels zu bestimmen.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Abbildung: Texturkoordinaten

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen - Idee

    Wo in der Pipeline wird texturiert?

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Textur anlegen

    Schritte

    1 Texturdefinition

    2 Texturkoordinaten Eckpunkten zuordnen

    3 Texturparameter

    4 Textur einschalten

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Texturdefinition

    Texturen laden

    Eine Textur kann entweder ein Bild sein, oder während derLaufzeit erzeugt werden.

    Mittels glTexImage2D wird die Textur in den Video Memorygeladen.

    Für externe Texturen muss der Image-Loder selbst geschriebenwerden.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    glTexImage2D(target , level , components , width ,

    height , border , format , type , data);

    target → Art der Textur, bsp. GL TEXTURE 2Dlevel → Sofern kein MipMap angewandt wird, 0components → Anzahl der Komponenten der Textur, bsp.GL RGB oder 3

    width, height → Breite und Höhe der Texturborder → Breite des Randesformat → Format der Pixeldaten, bsp. GL RGBtype → Typ der Pixeldaten, bsp. GL UNSIGNED BYTEdata → Adresse der Daten im Hauptspeicher

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    glTexImage2D(target , level , components , width ,

    height , border , format , type , data);

    //Beispielaufruf

    glTexImage2D (GL_TEXTURE_2D , 0, GL_RGB ,

    imageWidth , imageHeight , 0, GL_RGB ,

    GL_UNSIGNED_BYTE , imageData);

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Textur

    Schritte

    1 Texturdefinition

    2 Texturkoordinaten Eckpunkten zuordnen

    3 Texturparameter

    4 Textur einschalten

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Texturkoordinaten Eckpunkten zuordnen

    Mittels glTexCoord muss jedem Eckpunkt eineTexturkoordinate zugeordnet werden

    glTexCoord2f (0.2, 0.8); glVertex3f(A);

    glTexCoord2f (0.4, 0.2); glVertex3f(B);

    glTexCoord2f (0.8, 0.4); glVertex3f(C);

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Textur

    Schritte

    1 Texturdefinition

    2 Texturkoordinaten Eckpunkten zuordnen

    3 Texturparameter

    4 Textur einschalten

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Texturparameter

    Texturen spezifizieren

    glTexParameteri(GL TEXTURE 2D, name, value)

    Den mit name assoziierten Parametern können Wertezugewiesen werden.

    Beispiel, siehe Programmierbeispiel

    Umgang mit Texturkoordinaten außerhalb des Intervalls [0,1]in s- und/oder t-Richtung.

    name = bsp. GL TEXTURE WRAP T

    value = GL CLAMP, GL REPEAT

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Textur

    Schritte

    1 Texturdefinition

    2 Texturkoordinaten Eckpunkten zuordnen

    3 Texturparameter

    4 Textur einschalten

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Textur einschalten

    Textur einschalten

    glEnable(GL TEXTURE 2D);

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturen in OpenGL

    Beispiel zu Texturparameter

    Programmiereispiel

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturfilterung

    Texturfilterung

    Regelung wie eine Textur auf ein Objekt gemappt wird

    Jede Textur hat eine feste Größe.

    Texturgröße und Objektgröße im Bild stimmen nichtunbedingt überein.

    Wenn eine Textur auf ein Objekt gerendert wird, muss sieentweder verkleinert oder vergrößert werden.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturfilterung

    Farbwertbestimmung

    Die Pixelgröße ist aber fast nie gleich der Texelgröße

    Pixel können größer oder kleiner als Texel sein (je nachEntfernung des Pixels zur Kamera)

    Also müssen wir uns überlegen, wie dies behandeln

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturfilterung

    Texturfilterung

    Texturverkleinerung

    Wenn viele Texel auf ein Pixel abgebildet werden.

    Ein Pixel formt mehrere Texel.

    Perspektivisch im Hintergrund nötig.

    Texturvergrößerung

    Wenn ein Texel auf mehrere Pixel abgebildet wird.

    Mehrere Pixel formen ein Texel.

    Perspektivisch im Vordergrund nötig.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturfilterung

    Abbildung: Texelgröße != Pixelgröße

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturfilterung

    Texturverkleinerung und -vergrößerung

    Zuweisung über die Funktion glTexParameter.

    name = GL TEXTURE MIN FILTER, bzw.GL TEXTURE MAG FILTER

    value = GL NEAREST, Punktfilter

    value = GL LINEAR, Linearfilter

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    Texturfilterung

    Farbwertbestimmung

    Texturkoordinaten des aktuellen Pixels ergeben dieKoordinaten des roten Punktes.

    Resultat für GL NEAREST: der Texel-Farbwert der geringstenDistanz → gelb.Resultat für GL LINEAR: der interpolierte Farbwert derbenachbarten Texel-Farbwerte.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    MipMaps

    MipMaps

    Texturverkleinerung

    Mipmaps sind sortierte Mengen, die dasselbe Bild inunterschiedlichen Auflösungen bereit halten.

    Wenn bei Verkleinerungen mehrere Texel auf ein Pixelabgebildet werden müssen, stehen Mittelwerte schon bereit.

    Lösung für Echtzeitanwendungen.

    Niedrige Auflösungen ermöglichen schnellen Zugriff.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

  • Wiederholung - Beleuchtung Texturen

    MipMaps

    Quelle: http://en.wikipedia.org/wiki/Mipmap

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

    http://en.wikipedia.org/wiki/Mipmap

  • Wiederholung - Beleuchtung Texturen

    MipMaps

    MipMaps

    glTexParameter

    Mittels level Parameter in glTexImage kann bestimmt werdenwelche MipMap gesetzt wird.

    Nur relevant für Texturverkleinerung, da Vergrößerungeneinfach zu lösen sind.

    Deswegen über glTexParameter mit name =GL TEXTURE MIN FILTER MipMaps setzen.

    value = GL NEAREST MIPMAP NEAREST,GL NEAREST MIPMAP LINEAR usw.

    Gibt an wie zwischen und innerhalb der MipMap-Levelinterpoliert werden soll.

    Diana und Dominik Arbeitsgruppe Computergrafik

    Übungsstunde 8 zu Computergrafik 1

    Wiederholung - BeleuchtungGouraud-ShadingPhong-ShadingFlat-ShadingVergleich

    TexturenTexturen - IdeeTexturen in OpenGLTexturfilterungMipMaps