|
Animated GIFs aus mit OpenGL
erstellten Bildern
Softwarepraktikum Computergraphik
Saoud Asla: Ang. Informatik Student Betreuerin: Dr. Susanne Krömker |
|||||||||||||||||||||||
|
Beispiele |
- GIF(Graphics Interchange Format): ist ein Grafikformat, das mit einem Browser, Textverarbeitungsprogrammen oder Präsentations-Software darstellbar ist. - Animation: Animationen sind Visualisierungen, die durch eine Abfolge von mehreren Einzelbildern den Eindruck von Bewegung erwecken. - animiertes GIF: Datei im Graphics Interchange Format, die einen Satz von Bildern enthält, die in einer bestimmten Reihenfolge als Film präsentiert werden. •
Gut gestaltete Animationen können dazu helfen,
schneller und einfacher räumliche und zeitliche Sachverhalte zu begreifen.
Sie sind auch eine hervorragende Hilfe für Lehrer, wenn es darum geht,
schwierige Themen zu erklären. Die Schwierigkeit der Themen kann durch die
Beteiligung der mathematischen Gleichungen oder Vorstellungskraft entstehen. (Beispiel 1: Gauß-Funktion) • Darstellung von zeitabhängigen Vorgängen: Eine Animation kann zeitbasierte Phänomene visualisieren. (Beispiel 2: virtuelles Sonnensystem) • Animation kann verwendet werden, um durch das Betrachten aus unterschiedlichen Blickwinkeln mehrere Informationen auf gleichen Raum zu zeigen, zum Beispiel durch Kameratransformationen.(Beispiel 3: Kamerafahrt) Beispiel
1: gaußsche
Normalverteilung(Gauß-Funktion) mit variierten Standardabweichung im
Zeitablauf.
·
Das OpenGL Utility Toolkit (GLUT) ist eine umfangreiche
Bibliothek und Sammlung von OpenGL-Programmen, welche in erster Linie
systemnahe Eingabe- und Ausgabeoperationen des jeweiligen Betriebssystems
umsetzen. ·
Dieses Toolkit beinhaltet dabei Funktionen zum
Definieren von Fenstern, zur Steuerung dieser Fenster und zur Erfassung von
Benutzereingaben. ·
Es werden ebenfalls Funktionen bereitgestellt, die das
Zeichnen von primitiven geometrischen Strukturen ermöglichen. ·
Alle GLUT-spezifischen Funktionen beginnen immer mit
dem Präfix glut. ·
Im Beispiel 1: initialisiert der Aufruf
glutInit(&argc, argv); das GLUT-System in C++ und C: glutInit(&argc,
argv); glutInitDisplayMode(GLUT_DEPTH | GLUT_DOUBLE |
GLUT_RGBA); Ein Fenster mit geeigneten Größe erstellen: glutInitWindowPosition(5,
5); glutInitWindowSize(1280, 657); glutCreateWindow("animated gif"); Callback Funktionen : glutDisplayFunc(Gaussian); // Funktion zum Zeichnen des
Graphen glutReshapeFunc(changeSize); //Funktion die auf Größenänderungen
des Fensers eingeht
in der Methode changeSize wird die Projektionsmatrix erstellt(Perspektive in OpenGL) glutIdleFunc(Animation); // void Animation() wird aufgerufen,
wenn Ereignisse nicht empfangen werden, um den
Standardabweichung zu varriieren. Callback Funktionen behandeln: glutMainLoop(); void Gaussian(float standardabweicung) -
Zeichnet
den Graph von der Gaussianfunktion für eingegebene Standardabweichung -
Pseudocode : grid(x)=Anzahl der
Punkte zwischen a und -a //
Im Beispiel a=b=1 grid(y)=Anzahl der
Punkte zwischen b und -b von x=-a bis x=a von y=-b bis y=b Berechne z für x und y Point=(x,y,z) x=x+1/grid(x) , y=y+1/grid(y) Add point to points drawPoints(points) ·
Zum speichern der Pixeldaten aus dem Framepuffer stellt
OpenGL die Funktion glReadPixels bereit. ·
void glReadPixels(GLint x, GLint y, GLsizei width, GLsizei height, GLenum format, GLenum type, GLvoid * data); · data : Gibt einen Zeiger auf die Bilddaten im Speicher an Bild aus der
gezeichneten Scene erzeugen: 1. Pixeldaten aus dem Framebuffer speichern: byte*
bmpBuffer = (byte*)malloc(width*height * 3); if (!bmpBuffer) return; glReadPixels((GLint)0, (GLint)0, (GLint)width - 1, (GLint)height - 1,
GL_BGR_GL_UNSIGNED_BYTE,bmpBuffer); 2. Attribute für bitmapFileHeader und bitmapInfoHeader ensprechend setzen BITMAPFILEHEADER
bitmapFileHeader; BITMAPINFOHEADER bitmapInfoHeader; . . .
3. Bitmap Information und Pixeldaten in einer Datei speichern Animated GIFs aus den erzeugten Bildern
erstellen
Oder in der
Webseite : https://ezgif.com/ :
·
Nachteil: man kann
nur 80 MB maximal hochladen Zwei
Möglichkeiten um Geschwindigkeit der Animation zu erhöhen(reduzieren): 1. Durch Verzögerung zwischen den Frames. - Internet Explorer unterstützt Frame-Verzögerungen über 0,06 s, Verzögerungen die weniger als 0,06 s ist , wird auf 0,10 s aufgerundet. Quelle: http://nullsleep.tumblr.com/post/16524517190/animated-gif-minimum-frame-delay-browser 2. Schrittweite der variierten Parameter erhöhen(reduzieren)
· Wenn ein Bild große Flächen mit flachen oder einzelnen Tönen hat, dann ist GIF das Format der Wahl. · Das GIF-Format unterstützt 256 Farben (d.h. eine 8-Bit-Farbpalette). - Da Gifs nur 256 Farben verwenden, führen sie zu kompakten Bildern und verbrauchen weniger Bandbreite. · GIFs sind in der Animation weit verbreitet, weil sie Transparenz und interlacing ermöglichen . - Ihnen fehlt die volle Farbtiefe, die der Sensor einer Digitalkamera aufnehmen kann, und werden allmählich weniger verwendet. Beispiel
2: zeigt die Umdrehung von der Planette um die Sonne
Die relative Entfernung von der Sonne und die relative
Größe der Planeten fällt mit dem realen Sonnensystem zusammen(https://en.wikipedia.org/wiki/Solar_System).
· glTranslate(
GLfloat x, GLfloat y, GLfloat z) bewegt den Koordinatenursprung in den Punkt
(x,y,z) gezeichnet. · Im obigen
Beispiel wird erst die Sonne im Koordinatenursprung gezeichnet, dann werden
die andere Planeten jeweils nach einem Aufruf von glTranslate() mit
enstsprechenden Abstandsvektor gezeichnet. … drawSun(); glPushMatrix(); glMultMatrixf(getMercuryRotationMatrix(time)); glTranslatef(MercuryAbstandsvektor.x,
MercuryAbstandsvektor.y, MercuryAbstandsvektor.z); drawMercury(); glPopMatrix(); … … glPushMatrix(); glMultMatrixf(getNeptunRotationMatrix(time)); glTranslatef(NeptunAbstandsvektor.x,
NeptunAbstandsvektor.y, NeptunAbstandsvektor.z); drawNeptun(); glPopMatrix(); Wie kann ich mein Auge oder meine Kamera in meine Szene bewegen? Stellt die GLU-Bibliothek die gluLookAt () -Funktion zur Verfügung, die eine Augenposition, eine Position zum Betrachten und einen up-Vektor, alle in Objektraumkoordinaten benötigt. Diese Funktion berechnet die inverse Kameratransformation nach ihren Parametern und multipliziert sie mit dem aktuellen Matrixstapel.
Die Augenposition im rechten Bild, näher als im linken Bild
Durch das Sichtfeld kann man die Größe von dem Viewfrustum(Viewfrustum ist der sichtbare Bereich in Weltkoordinaten, abgegrenzt durch die zwei Clipping-Planes) bestimmen :
Beispiel 3: Kamerafahrt · Kamerafahrt
wird verwendet um mehrere Seiten von 3D Objekten zu zeigen.
Quellen : https://www.guidingtech.com/7729/difference-between-jpg-png-gif-bmp-image-formats/ https://www.e-teaching.org/didaktik/gestaltung/visualisierung/animation/ https://en.wikipedia.org/wiki/Gaussian_function https://de.wikipedia.org/wiki/OpenGL_Utility_Toolkit https://www.opengl.org/archives/resources/faq/technical/viewing.htm Kontakt
: asla@stud.uni-heidelberg.de |
||||||||||||||||||||||
