Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL –...

36
Transformaciones con OpenGL

Transcript of Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL –...

Page 1: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones con OpenGL

Page 2: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Pipeline:Transformaciones

Page 3: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

!  Las operaciones con matrices en OpenGL

–  glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION,

GL_TEXTURE

–  Es utilizada para definir las coordenadas de vision, se asigna una matriz de 4x4

–  De igual manera, se define la proyección, como la imagen es proyectada sobre la pantalla, una matriz de 4X4

Page 4: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

! Una alternativa, podemos asignar otros valores a los elementos de una matriz –  glLoadIdentity();

• La matriz inicial, una matriz identidad de 4x4

–  glLoadMatrix{f,d}( const TYPE* m ); –  glMultMatrix{f,d}( const TYPE* m ); –  glPushMatrix(); –  glPopMatrix();

• Las operaciones de stack son muy utiles para construir estructuras jerarquicas.

• Ejemplo Hacer el render de un carro con cuatro ruedas

Page 5: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

! glLoadMatrix*( element16);

glMatrixMode(GL_MODELVIEW); glfloat elems[16]; GLint k; for( k=0; k<16; k++) elems [k] = float (k); glLoadMatrixf(elems);

Page 6: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

M=

0.0 4.0 8.0 12.0

1.0 5.0 9.0 13.0

2.0 6.0 10.0 14.0

3.0 7.0 11.0 15.0

Page 7: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Composicion de Matrices

! glMultMatrix*(otroelements16); M= MxM1 glMatrixMode(GL_MODELVIEW); glLoadIdentity( ); glMultMatrixf( elemsM2); glMultMatrixf( elemsM1); M=M2xM1

Page 8: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

!  OpenGL ofrece transformaciones preconstruidas : –  glTranslate{f,d}( TYPE x, TYPE, y, TYPE z );

Efecto de glTranslate()

Page 9: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformationes

–  glRotate{f,d}( TYPE angle, TYPE x, TYPE y, TYPE z );

Efecto de glRotatef(45.0, 0.0, 0.0, 1.0)

Page 10: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

–  glScale{f,d}( TYPE x, TYPE y, TYPE z);

El efecto de glScalef(2.0, -0.5, 1.0)

Page 11: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

! Rotando primero o Translación primero :

Page 12: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

! Transformaciones de Visión –  Hay que seleccionar un sistema de Visión o de

Camara • Center-orientation-up system

–  Aplicando gluLookAt. »  gluLookAt( cx, cy, cz, atx, aty, atz, upx, upy, upz ); »  ( cx, cy, cz ) es la ubicación de la cámara »  ( atx, aty, atz ) hacia donde ve la cámara »  ( upx, upy, upz ) es el vector de orientación de la

cámara

• Coordenadas Polares

Page 13: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

! Transformaciones de Proyección: Proyección en Perspectiva –  glFrustum( GLdouble left, GLdouble right,

GLdouble bottom, GLdouble top, GLdouble near, GLdouble far );

Page 14: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

–  gluPerspective( GLdouble fovy, GLdouble aspect, GLdouble near, GLdouble far );

Page 15: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

! Transformación de Proyección: Proyección Ortogonal (Orthogonal projection) –  glOrtho( GLdouble left, GLdouble right, GLdouble bottom,

GLdouble top, GLdouble near, GLdouble far );

–  gluOrtho2D( GLdouble left, GLdouble right, GLdouble bottom, GLdouble top );

Page 16: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

! Transformación de Viewport –  glViewport( GLint x, GLint y, GLsizei w, GLsizei

h );

Page 17: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Transformaciones

!  Nota: – Por default, el observador esta situado en

el origen, y mira hacia el eje negativo del eje-z

Page 18: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Ejemplo

Page 19: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Rotando un cubo con Interpolacion de Color

#include <stdlib.h> #include <GL/glut.h> GLfloat vertices[][3] = {{-1.0,-1.0,-1.0}, {1.0,-1.0,-1.0}, {1.0,1.0,-1.0}, {-1.0,1.0,-1.0}, {-1.0,-1.0,1.0}, {1.0,-1.0,1.0}, {1.0,1.0,1.0}, {-1.0,1.0,1.0}}; GLfloat colors[][3] = {{0.0,0.0,0.0},{1.0,0.0,0.0}, {1.0,1.0,0.0}, {0.0,1.0,0.0}, {0.0,0.0,1.0}, {1.0,0.0,1.0}, {1.0,1.0,1.0}, {0.0,1.0,1.0}};

Page 20: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

void polygon(int a, int b, int c, int d) { /* draw a polygon via list of vertices */ glBegin(GL_POLYGON); glColor3fv(colors[a]); glVertex3fv(vertices[a]); glColor3fv(colors[b]); glVertex3fv(vertices[b]); glColor3fv(colors[c]); glVertex3fv(vertices[c]); glColor3fv(colors[d]); glVertex3fv(vertices[d]); glEnd(); }

Page 21: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

void colorcube() { /* map vertices to faces */ polygon(0,3,2,1); polygon(2,3,7,6); polygon(0,4,7,3); polygon(1,2,6,5); polygon(4,5,6,7); polygon(0,1,5,4); }

Page 22: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

static GLfloat theta[] = {0.0,0.0,0.0}; static GLint axis = 2; void display() { /* display callback, clear frame buffer and z buffer, rotate cube and draw, swap buffers */ glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glLoadIdentity(); glRotatef(theta[0], 1.0, 0.0, 0.0); glRotatef(theta[1], 0.0, 1.0, 0.0); glRotatef(theta[2], 0.0, 0.0, 1.0); colorcube(); glFlush(); glutSwapBuffers(); }

Page 23: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

void spinCube() { /* idle callback, spin cube 2 degrees about selected axis */ theta[axis] += 2.0; if( theta[axis] > 360.0 ) theta[axis] -= 360.0; /* display(); */ glutPostRedisplay(); } void mouse(int btn, int state, int x, int y) { /* mouse callback, selects an axis about which to rotate */ if(btn==GLUT_LEFT_BUTTON && state == GLUT_DOWN) axis = 0; if(btn==GLUT_MIDDLE_BUTTON && state == GLUT_DOWN) axis = 1; if(btn==GLUT_RIGHT_BUTTON && state == GLUT_DOWN) axis = 2; }

Page 24: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

void myReshape(int w, int h) { glViewport(0, 0, w, h); glMatrixMode(GL_PROJECTION); glLoadIdentity(); if (w <= h) glOrtho(-2.0, 2.0, -2.0 * (GLfloat) h / (GLfloat) w, 2.0 * (GLfloat) h / (GLfloat) w, -10.0, 10.0); else glOrtho(-2.0 * (GLfloat) w / (GLfloat) h, 2.0 * (GLfloat) w / (GLfloat) h, -2.0, 2.0, -10.0, 10.0); glMatrixMode(GL_MODELVIEW); }

Page 25: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

int main(int argc, char **argv) { glutInit(&argc, argv); /* need both double buffering and z buffer */ glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH); glutInitWindowSize(500, 500); glutCreateWindow("colorcube"); glutReshapeFunc(myReshape); glutDisplayFunc(display); glutIdleFunc(spinCube); glutMouseFunc(mouse); glEnable(GL_DEPTH_TEST); /* Enable hidden-surface removal */ glutMainLoop(); }

Page 26: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –
Page 27: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Ejemplo

!  planet.c – Control:

•  ‘d’ •  ‘y’ •  ‘a’ •  ‘A’ •  ESC

Page 28: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

#include <GL/glut.h> static GLfloat year=0.0f, day=0.0f; void init() { glClearColor(0.0, 0.0, 0.0, 0.0); } void GL_reshape(GLsizei w, GLsizei h) // GLUT reshape function {

glViewport(0, 0, w, h); // viewport transformation glMatrixMode(GL_PROJECTION); // projection transformation glLoadIdentity(); gluPerspective(60.0, (GLfloat)w/(GLfloat)h, 1.0, 20.0); glMatrixMode(GL_MODELVIEW); // viewing and modeling transformation glLoadIdentity(); gluLookAt(0.0, 3.0, 5.0, // eye 0.0, 0.0, 0.0, // center 0.0, 1.0, 0.0); // up

}

Page 29: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

void GL_display() // GLUT display function {

// clear the buffer glClear(GL_COLOR_BUFFER_BIT);

glColor3f(1.0, 1.0, 1.0); glPushMatrix(); glutWireSphere(1.0, 20, 16); // the Sun glRotatef(year, 0.0, 1.0, 0.0); glTranslatef(3.0, 0.0, 0.0); glRotatef(day, 0.0, 1.0, 0.0); glutWireSphere(0.5, 10, 8); // the Planet glPopMatrix(); // swap the front and back buffers glutSwapBuffers();

}

Page 30: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

void GL_idle() // GLUT idle function {

day += 10.0; if(day > 360.0) day -= 360.0;

year += 1.0; if(year > 360.0) year -= 360.0;

// recall GL_display() function glutPostRedisplay();

}

Page 31: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

void GL_keyboard(unsigned char key, int x, int y) // GLUT keyboard function {

switch(key) { case 'd': day += 10.0; if(day > 360.0) day -= 360.0; glutPostRedisplay(); break; case 'y': year += 1.0; if(year > 360.0) year -= 360.0; glutPostRedisplay(); break; case 'a': glutIdleFunc(GL_idle); // assign idle function break; case 'A': glutIdleFunc(0); break; case 27: exit(0); }

}

Page 32: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

int main(int argc, char** argv) {

glutInit(&argc, argv); glutInitWindowSize(500, 500); glutInitWindowPosition(0, 0); glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB); glutCreateWindow("Planet"); init(); glutDisplayFunc(GL_display); glutReshapeFunc(GL_reshape); glutKeyboardFunc(GL_keyboard); glutMainLoop(); return 0;

}

Page 33: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –
Page 34: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Tarea

Page 35: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

!   Para poder ejecutar el código que simula un perro corriendo, el código esta en la carpeta C-Dog ubicada en el sitio del curso. Enfocarse en las transformaciones en el código proporcionado.

!   La tarea consiste en modificar el movimiento del perro para que pueda correr de manera mas adecuada

!   Fecha de entrega 30 de marzo

Page 36: Transformaciones con OpenGL - Computo Visual€¦ · Las operaciones con matrices en OpenGL – glMatrixMode( GLenum mode ); • mode: GL_MODELVIEW, GL_PROJECTION, GL_TEXTURE –

Preguntas

?