Diferencia entre revisiones de «ManuelRomero/grafica/escena1/objeto»

De WikiEducator
Saltar a: navegación, buscar
 
(18 revisiones intermedias por el mismo usuario no mostrado)
Línea 1: Línea 1:
{{:Usuario:ManuelRomero/grafica/escena1/nav}} <br>  
+
{{:Usuario:ManuelRomero/grafica/escena1/nav}}  
 +
<br>  
 +
{{#widget:Slides}}
  
=== Coordenadadas del objeto  ===
+
<div class="slides layout-regular template-default">
  
 +
<div class="slide">
 +
=== Coordenadadas del objeto: '''''La matriz escena''''' ===
 +
Empezamos con dos tipos de coordenadas
 
#Coordenadas globales o del mundo  
 
#Coordenadas globales o del mundo  
 
#Coordenadas locales o del objeto
 
#Coordenadas locales o del objeto
 
 
*Dibujamos un eje de coordenadas x,y,z.  
 
*Dibujamos un eje de coordenadas x,y,z.  
 
*Estará centrado en el punto 0,0,0
 
*Estará centrado en el punto 0,0,0
 +
</div>
 +
<div class="slide">
  
&lt;/div&gt;
 
<div class="slide">
 
 
=== Coordenadadas del objeto  ===
 
=== Coordenadadas del objeto  ===
  
 
;El código fuente
 
;El código fuente
 
 
<source lang="cpp">
 
<source lang="cpp">
 
void dibujaCoordenadas(void){
 
void dibujaCoordenadas(void){
Línea 24: Línea 27:
 
  glVertex3f(0,0,0);
 
  glVertex3f(0,0,0);
 
  glVertex3f(15,0,0);
 
  glVertex3f(15,0,0);
   
 
 
  glColor3f(0,1,0);//Eje Y
 
  glColor3f(0,1,0);//Eje Y
 
  glVertex3f(0,0,0);
 
  glVertex3f(0,0,0);
Línea 36: Línea 38:
 
}
 
}
 
</source>  
 
</source>  
</div> <div class="slide">
+
</div>
=== Coordenadadas del objeto ===
+
<div class="slide">
 +
=== Veamos la imagen ===
  
 
*A OpenGL le especificamos bien por puntos o por vectores estos valores  
 
*A OpenGL le especificamos bien por puntos o por vectores estos valores  
 
*OpenGL rederiza en la pantalla y visualiza dichos puntos según le especifiquemos
 
*OpenGL rederiza en la pantalla y visualiza dichos puntos según le especifiquemos
 +
[[Image:CoordenadasOpenGLBásico.png|350px|center]]
 +
</div>
  
[[Image:CoordenadasOpenGLBásico.png|200px]]
+
<div class="slide">
</div> <div class="slide">
+
=== Giramos ===
=== Coordenadadas del objeto ===
+
 
+
;giramos para ver mejor
+
 
+
 
*Lo giramos para ver la coordenada z. Esta parte luego la veremos  
 
*Lo giramos para ver la coordenada z. Esta parte luego la veremos  
*Para conseguirlo he girado 40º en el eje de x y 40º en el eje de y
+
*Para conseguirlo he girado 40º en el eje de '''''X''''' y 40º en el eje de '''''Y'''''
 
+
 
<source lang="cpp">
 
<source lang="cpp">
 
   .. .. ..
 
   .. .. ..
Línea 60: Línea 60:
 
   .. .. ..
 
   .. .. ..
 
</source>  
 
</source>  
</div> <div class="slide">
+
</div>  
 +
<div class="slide">
 
=== Coordenadas del objeto  ===
 
=== Coordenadas del objeto  ===
 
+
*Vemos lo que sería las coordenadas del objeto
[[Image:CoordenadasOpenGL.png|200px]]  
+
[[Image:CoordenadasOpenGL.png|400px|center]]  
 
+
</div>
 +
<div class="slide">
 +
===Dibujando directamente===
 +
*Quitamos el giro y dibujamos una tetera
 
*Este eje de coordenadas que hemos dibujado representaría el eje de coordenadas del objeto  
 
*Este eje de coordenadas que hemos dibujado representaría el eje de coordenadas del objeto  
 
*Ahora dibujamos un objeto en él, por ejemplo una tetera  
 
*Ahora dibujamos un objeto en él, por ejemplo una tetera  
*con la barra espaciadora podemos cambiar su representación, sólida o de alambres
+
*Con la barra espaciadora podemos cambiar su representación, sólida o de alambres
</div> <div class="slide">
+
<source lang=cpp>
 +
  case'2':
 +
      //quitamos el giro
 +
      glRotatef(40,0,1,0);
 +
      glRotatef(-30,1,0,0);
 +
      glutPostRedisplay();
 +
  case '3':
 +
      //Dibujo la tetera
 +
      glutWireTeapot(3);
 +
      glFlush();
 +
      break;
 +
</source>
 +
</div> -
 +
<div class="slide">
 
*Representación sólida
 
*Representación sólida
 
+
[[Image:Tetera1.png|RTENOTITLE|center]]  
[[Image:Tetera1.png|RTENOTITLE]]  
+
</div>
</div> <div class="slide">
+
<div class="slide">
 
*Represetnación en alambres
 
*Represetnación en alambres
  
[[Image:Tetera2.png|RTENOTITLE]]  
+
[[Image:Tetera2.png|RTENOTITLE|center]]  
</div> <div class="slide">
+
</div>  
 +
<div class="slide">
 
*Representación girada
 
*Representación girada
 
+
*Giramos en torno al eje X  20º y entorno al eje y 45º para tener una visión más de 3D.
[[Image:Tetera3.png|RTENOTITLE]]  
+
*Posteriormente se detallan estas operaciones
 
+
[[Image:Tetera3.png|RTENOTITLE|350px|center]]  
*Ahora hemos dibujado la tetera respecto al eje de coordenadas del mundo
+
*Ahora hemos dibujado la tetera respecto al eje de coordenadas del mundo con centro 0,0,0
</div> <div class="slide">
+
</div>  
 +
<div class="slide">
 
=== Eje de coordenadas del objeto  ===
 
=== Eje de coordenadas del objeto  ===
 
 
*En realidad el objeto está en una posición del espacio con sus coordenadas  
 
*En realidad el objeto está en una posición del espacio con sus coordenadas  
 
*La idea es llevármelo a las coordenadas del mundo, para mi de referencia  
 
*La idea es llevármelo a las coordenadas del mundo, para mi de referencia  
Línea 93: Línea 111:
 
  (10,10,10)- (5,15,10)
 
  (10,10,10)- (5,15,10)
 
  (10,10,10)- (10,10,15)
 
  (10,10,10)- (10,10,15)
</div> <div class="slide">
+
</div>
 +
<div class="slide">
 +
===Coordenadas del objeto===
 
*Gráficamente lo podemos ver en la imagen (siempre respecto al eje de coordenadas de nuestro mundo (0,0,0) como centro
 
*Gráficamente lo podemos ver en la imagen (siempre respecto al eje de coordenadas de nuestro mundo (0,0,0) como centro
  
[[Image:CoordenadasObjeto1.png|RTENOTITLE]]  
+
[[Image:CoordenadasObjeto1.png|RTENOTITLE|center]]  
</div> <div class="slide">
+
</div>
*Lo giramos para ver el componente z (Se observa en diferente posición pues lo he rotado respecto a X e Y de las coordenadas del mundo no de ella misma
+
<div class="slide">
 +
===Girando
 +
*Lo giramos para ver el componente '''''Z''''' (Se observa en diferente posición pues lo he rotado respecto a X e Y de las coordenadas del mundo no de ella misma
  
[[Image:CoordenadasObjeto2.png|RTENOTITLE]]  
+
[[Image:CoordenadasObjeto2.png|RTENOTITLE|center]]  
</div> <div class="slide">
+
</div>  
 +
<div class="slide">
 +
===Ambos ejes===
 
*Vemos los dos ejes de coordenadas
 
*Vemos los dos ejes de coordenadas
  
[[Image:CoordenadasObjeto3.png|RTENOTITLE]]  
+
[[Image:CoordenadasObjeto3.png|RTENOTITLE|center]]  
</div> <div class="slide">
+
</div>
 +
<div class="slide">
 +
===Girando===
 
*Lo giramos para verlo un poco mejor  
 
*Lo giramos para verlo un poco mejor  
 
*Vemos el objeto en el eje de coordenadas del mundo global y lo queremos pasar al eje de coordenadas del mundo local o del objeto
 
*Vemos el objeto en el eje de coordenadas del mundo global y lo queremos pasar al eje de coordenadas del mundo local o del objeto
  
 
[[Image:CoordenadasObjeto4.png|RTENOTITLE]]  
 
[[Image:CoordenadasObjeto4.png|RTENOTITLE]]  
</div> <div class="slide">
+
</div>  
===Vamos a ver como pasar el objeto a las coordenadas locales  
+
<div class="slide">
 
+
===Paso de coordenadas===
*Para ello vamos a multiplicar cada vétice del objeto por una matriz de escena  
+
*Vamos a ver como pasar el objeto a las coordenadas locales  
 +
*Para ello vamos a multiplicar cada vértice del objeto por una''''' matriz de escena '''''
 
*Esta matriz permite realizar operaciones de rotación traslación y escalado  
 
*Esta matriz permite realizar operaciones de rotación traslación y escalado  
*En nuestro caso queremos coger la tetera y
+
*La operacion sería
 +
'''''(X,Y,Z,W)'''''<sup>T</sup><sub>punto_de_vista</sub>='''''(X,Y,Z,W)'''''<sup>T</sup><sub>objeto</sub> * M<sub>mundo</sub>*'''''
 +
</div>
  
 +
<div class="slide">
 +
===La matriz de escena===
 +
*Estas operaciones se realizan el OpenGL usando una matriz
 +
*Cada vez que realizamos una operación de rotación, o de traslación estamos multiplicando por la matriz correspondiente
 +
*En openGL especificamos que trabajamos con la matriz
 +
<source lang=cpp>
 +
.. .. ..
 +
glMatrixMode(GL_MODELVIEW);
 +
.. .. ..
 +
</source>
 +
*Al principio la matriz tiene el valor identidad 1 o elemento neutro
 +
</div>
 +
<div class="slide">
 +
===Tipos de matrices===
 +
*Tenemos dos tipos de matrices
 +
*Esta es la matriz Modelo Vista
 +
*Hasta ahora hemos especificado la parte del modelo o de la escena con rotaciones y traslaciones
 +
*Para realizar estas operaciones hemos usamos las primitivas de '''''openGL'''''
 +
<source lang=cpp>
 +
.. .. ..
 +
  glRotatef(alpha,x,y,z);//rota ''alpha'' grados entorno al eje especificado ''x,y,x''
 +
  glTranslatef(x,y,z); //Traslada la imagen x,y,z
 +
  glScalef(sx,sy,xz);//Multiplica la matriz de escalado los factores sx,sy,xz.
 +
.. .. ..
 +
</source>
 +
</div>
 +
<div class="slide">
 +
===Operaciones pasa pasar de coordenadas===
 +
*En nuestro caso queremos coger la tetera y
 
#Trasladarla al punto 10,10,10.  
 
#Trasladarla al punto 10,10,10.  
 
##trasladar 10 unidades en X  
 
##trasladar 10 unidades en X  
Línea 122: Línea 180:
 
##trasladar 10 unidades en Z  
 
##trasladar 10 unidades en Z  
 
#Rotar 45 grados
 
#Rotar 45 grados
 
+
</div>
Son en total 4 operaciones [[Image:CoordenadasMundoObjeto.png|RTENOTITLE]] <source lang="cpp">
+
<div class="slide">
 +
===Operaciones===
 +
*Son en total 4 operaciones
 +
[[Image:CoordenadasMundoObjeto.png|RTENOTITLE|center]]  
 +
<source lang="cpp">
 
.. ... ..  
 
.. ... ..  
 
   //Roto la tetera para llegar al eje de coordenadas del objeto
 
   //Roto la tetera para llegar al eje de coordenadas del objeto
Línea 131: Línea 193:
 
  glFlush();
 
  glFlush();
 
.. .. ..  
 
.. .. ..  
</source> {{Resumen|
+
</source>  
 +
</div>
 +
 
 +
<div class="slide">
 +
*Vemos ahora dos objetos y los desplazamos
 +
[[Imagen:dosObjetos.png]]
 +
*Los desplazamos
 +
[[Imagen:dosObjetosDesplazados.png]]
 +
</div>
 +
<div class="slide">
 +
*Si solo queremos desplazar un objeto respecto a otro
 +
*Entonces debemos mantener diferentes matrices de transformación a difernetes objetos de nuestra escena
 +
*Dibujamos un objeto
 +
*Lo desplazamos con M1
 +
*Recuperamos la matriz anterior
 +
*La aplicamos a los nuevos objetos
 +
*Lo vemos en las imágenes
 +
</div>
 +
<div class="slide">
 +
 
 +
<gallery caption="Desplazamiento entre objetos">
 +
Imagen:desplazaObjeto1.png
 +
Imagen:desplazaObjeto2.png
 +
Imagen:desplazaObjeto3.png
 +
Imagen:desplazaObjeto4.png
 +
Imagen:desplazaObjeto5.png
 +
</gallery>
 +
</div>
 +
<div class="slide">
 +
 
 +
*OpenGL dispone de una pila para las matrices
 +
*Para guardar/recuperar matrices:
 +
glPushMatrix();//Guarda la matriz en la pila acutal
 +
glPopMatriz();//Recupera la matriz de la pila.
 +
*Estas funciones trabajan con la matriz actual.
 +
</div>
 +
<div class="slide">
 +
 
 +
*El código asociado
 +
<source lang=cpp>
 +
void trasladaCubo(){
 +
static int i =0;
 +
glClear(GL_COLOR_BUFFER_BIT);
 +
glFlush();
 +
glColor3f(1,0,0);
 +
glPopMatrix();
 +
glPushMatrix();
 +
dibujaCoordenadas();
 +
glutWireSphere(2,30,30);
 +
glTranslatef(0,5+i++,0);
 +
glutWireCube(2);
 +
glFlush();
 +
}
 +
</source>
 +
</div>
 +
<div class="slide">
 +
{{Resumen|
 
*En la escena tengo unos objetos
 
*En la escena tengo unos objetos
 
*Cada uno tiene sus coordenadas ''coordenadas del objeto''
 
*Cada uno tiene sus coordenadas ''coordenadas del objeto''
Línea 140: Línea 258:
 
}}  
 
}}  
 
   '''(X,Y,Z)'''<sub>mundo</sub> ='''(X,Y,Z)'''<sub>objeto</sub> * '''M'''<sub>escena</sub>
 
   '''(X,Y,Z)'''<sub>mundo</sub> ='''(X,Y,Z)'''<sub>objeto</sub> * '''M'''<sub>escena</sub>
 
{{Recursos de la Web|
 
http://asanchez.cs.buap.mx/arreglos_vertices.pdf
 
}}
 
 
</div>
 
</div>

Última revisión de 10:10 13 jun 2013



Coordenadadas del objeto: La matriz escena

Empezamos con dos tipos de coordenadas

  1. Coordenadas globales o del mundo
  2. Coordenadas locales o del objeto
  • Dibujamos un eje de coordenadas x,y,z.
  • Estará centrado en el punto 0,0,0

Coordenadadas del objeto

El código fuente
void dibujaCoordenadas(void){
	porFlechitas();
	glLineWidth(2);
	glBegin(GL_LINES);
	   glLineWidth(3);
	   glColor3f(1,0,0);//Eje X
	   glVertex3f(0,0,0);
	   glVertex3f(15,0,0);
	   glColor3f(0,1,0);//Eje Y
	   glVertex3f(0,0,0);
	   glVertex3f(0,15,0);
       glColor3f(0,0,1);//Eje Z
	   glVertex3f(0,0,0);
	   glVertex3f(0,0,15);
	   glLineWidth(1);
	glEnd();
	glFlush();
}

Veamos la imagen

  • A OpenGL le especificamos bien por puntos o por vectores estos valores
  • OpenGL rederiza en la pantalla y visualiza dichos puntos según le especifiquemos
CoordenadasOpenGLBásico.png

Giramos

  • Lo giramos para ver la coordenada z. Esta parte luego la veremos
  • Para conseguirlo he girado 40º en el eje de X y 40º en el eje de Y
  .. .. ..
    glMatrixMode(GL_MODELVIEW);
    glLoadIdentity();   
    glRotatef(40.0f,1,0,0);
    glRotatef(40.0f,0,1,0);
    glutPostRedisplay();
  .. .. ..

Coordenadas del objeto

  • Vemos lo que sería las coordenadas del objeto
CoordenadasOpenGL.png

Dibujando directamente

  • Quitamos el giro y dibujamos una tetera
  • Este eje de coordenadas que hemos dibujado representaría el eje de coordenadas del objeto
  • Ahora dibujamos un objeto en él, por ejemplo una tetera
  • Con la barra espaciadora podemos cambiar su representación, sólida o de alambres
   case'2':
      //quitamos el giro
      glRotatef(40,0,1,0);
      glRotatef(-30,1,0,0);
      glutPostRedisplay();
   case '3':		
      //Dibujo la tetera 
      glutWireTeapot(3);
      glFlush();
      break;
-
  • Representación sólida
RTENOTITLE
  • Represetnación en alambres
RTENOTITLE
  • Representación girada
  • Giramos en torno al eje X 20º y entorno al eje y 45º para tener una visión más de 3D.
  • Posteriormente se detallan estas operaciones
RTENOTITLE
  • Ahora hemos dibujado la tetera respecto al eje de coordenadas del mundo con centro 0,0,0

Eje de coordenadas del objeto

  • En realidad el objeto está en una posición del espacio con sus coordenadas
  • La idea es llevármelo a las coordenadas del mundo, para mi de referencia
  • Planteamos este nuevo eje de coordenadas
  • Podemos ver que respecto al eje de coordenadas del mundo (0,0,0), tiene los siguientes vectores
(10,10,10)- (15,15,10)
(10,10,10)- (5,15,10)
(10,10,10)- (10,10,15)

Coordenadas del objeto

  • Gráficamente lo podemos ver en la imagen (siempre respecto al eje de coordenadas de nuestro mundo (0,0,0) como centro
RTENOTITLE

===Girando

  • Lo giramos para ver el componente Z (Se observa en diferente posición pues lo he rotado respecto a X e Y de las coordenadas del mundo no de ella misma
RTENOTITLE

Ambos ejes

  • Vemos los dos ejes de coordenadas
RTENOTITLE

Girando

  • Lo giramos para verlo un poco mejor
  • Vemos el objeto en el eje de coordenadas del mundo global y lo queremos pasar al eje de coordenadas del mundo local o del objeto

RTENOTITLE

Paso de coordenadas

  • Vamos a ver como pasar el objeto a las coordenadas locales
  • Para ello vamos a multiplicar cada vértice del objeto por una matriz de escena
  • Esta matriz permite realizar operaciones de rotación traslación y escalado
  • La operacion sería
(X,Y,Z,W)Tpunto_de_vista=(X,Y,Z,W)Tobjeto * Mmundo*

La matriz de escena

  • Estas operaciones se realizan el OpenGL usando una matriz
  • Cada vez que realizamos una operación de rotación, o de traslación estamos multiplicando por la matriz correspondiente
  • En openGL especificamos que trabajamos con la matriz
 .. .. ..
 glMatrixMode(GL_MODELVIEW);
 .. .. ..
  • Al principio la matriz tiene el valor identidad 1 o elemento neutro

Tipos de matrices

  • Tenemos dos tipos de matrices
  • Esta es la matriz Modelo Vista
  • Hasta ahora hemos especificado la parte del modelo o de la escena con rotaciones y traslaciones
  • Para realizar estas operaciones hemos usamos las primitivas de openGL
 
 .. .. ..
   glRotatef(alpha,x,y,z);//rota ''alpha'' grados entorno al eje especificado ''x,y,x''
   glTranslatef(x,y,z); //Traslada la imagen x,y,z
   glScalef(sx,sy,xz);//Multiplica la matriz de escalado los factores sx,sy,xz.
 .. .. ..

Operaciones pasa pasar de coordenadas

  • En nuestro caso queremos coger la tetera y
  1. Trasladarla al punto 10,10,10.
    1. trasladar 10 unidades en X
    2. trasladar 10 unidades en Y
    3. trasladar 10 unidades en Z
  2. Rotar 45 grados

Operaciones

  • Son en total 4 operaciones
RTENOTITLE
.. ... .. 
  //Roto la tetera para llegar al eje de coordenadas del objeto
		  glTranslatef(10,10,10);
		  glRotated(45,0,0,1);
		  glutWireTeapot(3);
		  glFlush();
.. .. ..
  • Vemos ahora dos objetos y los desplazamos

Archivo:DosObjetos.png

  • Los desplazamos

Archivo:DosObjetosDesplazados.png

  • Si solo queremos desplazar un objeto respecto a otro
  • Entonces debemos mantener diferentes matrices de transformación a difernetes objetos de nuestra escena
  • Dibujamos un objeto
  • Lo desplazamos con M1
  • Recuperamos la matriz anterior
  • La aplicamos a los nuevos objetos
  • Lo vemos en las imágenes
  • OpenGL dispone de una pila para las matrices
  • Para guardar/recuperar matrices:
glPushMatrix();//Guarda la matriz en la pila acutal
glPopMatriz();//Recupera la matriz de la pila.
  • Estas funciones trabajan con la matriz actual.
  • El código asociado
void trasladaCubo(){
	static int i =0;
	 glClear(GL_COLOR_BUFFER_BIT);
	 glFlush();
	 glColor3f(1,0,0);
	 glPopMatrix();
	 glPushMatrix();
	 dibujaCoordenadas();
	 glutWireSphere(2,30,30);
	 glTranslatef(0,5+i++,0);
	 glutWireCube(2);
	 glFlush();
}


Icon summary.gif

Resumen

  • En la escena tengo unos objetos
  • Cada uno tiene sus coordenadas coordenadas del objeto
  • Paso estas coordenadas a las coordenadas del mundo
  • Para ello multiplico por la matriz M que llamaremos matriz de escena
  • Sistema de coordenadas en que se define la escena. Define cómo se colocan los diferentes objetos en la escena.
  • La matriz de escena lleva movimientos de rotación traslación, giro, simetria, ...


 (X,Y,Z)mundo =(X,Y,Z)objeto * Mescena