univ. michoacana de san nicolas de hgo. facultad …camarena/notasgraficacion.pdfvideo-juegos....

Univ. Michoacana de San Nicolas de Hgo.Facultad de Ingenierıa Electrica

Notas de Graficacion

Jose Antonio Camarena Ibarrola

Marzo de 2010

Indice general

1. Introduccion 7

2. Primitivas de Graficacion 92.1. Algoritmos de trazado de lıneas . . . . . . . . . . . . . . . . . 9

2.1.1. Algoritmo DDA (Digital Diferential Analizer) . . . . . 112.1.2. Algoritmo de Bresenham . . . . . . . . . . . . . . . . . 12

2.2. Algoritmos de trazado de circunferencias . . . . . . . . . . . . 152.2.1. Algoritmo de Bresenham para trazado de circunferencias 162.2.2. Algoritmo del punto medio para trazado de circunfer-

encias . . . . . . . . . . . . . . . . . . . . . . . . . . . 172.3. Algoritmos de generacion de elipses . . . . . . . . . . . . . . . 19

2.3.1. Algoritmo de Bresenham para generacion de elipses . . 202.3.2. Algoritmo del punto medio para generacion de elipses . 21

2.4. Polilıneas . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 262.5. Curvas Splines cubicas naturales . . . . . . . . . . . . . . . . . 26

2.5.1. Splines de Hermite . . . . . . . . . . . . . . . . . . . . 272.5.2. Curvas de Bezier . . . . . . . . . . . . . . . . . . . . . 312.5.3. Splines B . . . . . . . . . . . . . . . . . . . . . . . . . 31

2.5.3.1. Splines B uniformes . . . . . . . . . . . . . . 342.6. Estructura de un Programa OpenGL . . . . . . . . . . . . . . 362.7. Despliege de lineas, triangulos, cuadrados, circunferencias, etc

mediante OpenGL . . . . . . . . . . . . . . . . . . . . . . . . 39

3. Algoritmos de Relleno de areas 413.1. Relleno mediante ordenamiento de aristas . . . . . . . . . . . 413.2. Relleno mediante complementacion . . . . . . . . . . . . . . . 43

3.2.1. Modificacion mediante el uso de una cerca . . . . . . . 473.3. Algoritmo simple de siembra de semilla . . . . . . . . . . . . . 49

3

4 INDICE GENERAL

3.4. Siembra de semilla por lınea de rastreo . . . . . . . . . . . . . 52

3.5. Funciones de OpenGL para manejo del color de las figuras ydel fondo . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 52

4. Algoritmos de Recorte 55

4.1. Codigos de region para determinar la vi-sibilidad de lıneas . . 55

4.2. Algoritmo de recorte explıcito en 2D . . . . . . . . . . . . . . 56

4.2.1. Ejemplo . . . . . . . . . . . . . . . . . . . . . . . . . . 59

4.3. Algoritmo de Sutherland-Cohen . . . . . . . . . . . . . . . . . 60

4.4. Algoritmo de la subdivision del punto medio . . . . . . . . . . 60

4.5. Algoritmo de Cyrus-Beck para recorte de regiones convexas . . 61

4.5.1. Ejemplo . . . . . . . . . . . . . . . . . . . . . . . . . . 63

5. Pipeline de visualizacion bidimensional 67

5.1. Coordenadas locales, coordenadas mundiales, puerto de vision 67

5.2. Funciones de OpenGL para visualizacion bidimensional . . . . 69

6. Transformaciones geometricas 71

6.1. Transformaciones afines . . . . . . . . . . . . . . . . . . . . . 73

6.2. Transformaciones geometricas bidimensionales basicas . . . . . 73

6.2.1. Traslacion . . . . . . . . . . . . . . . . . . . . . . . . . 73

6.2.2. Escalamiento . . . . . . . . . . . . . . . . . . . . . . . 74

6.2.3. Rotacion . . . . . . . . . . . . . . . . . . . . . . . . . . 74

6.3. Coordenadas Homogeneas . . . . . . . . . . . . . . . . . . . . 75

6.4. Transformaciones compuestas . . . . . . . . . . . . . . . . . . 77

6.5. Escalamiento respecto a un punto fijo . . . . . . . . . . . . . . 77

6.5.1. Rotacion respecto a un punto arbitrario . . . . . . . . 79

6.6. Reflexiones . . . . . . . . . . . . . . . . . . . . . . . . . . . . 82

6.7. Transformaciones Geometricas en 3D Simples . . . . . . . . . 83

6.7.1. Escalamiento . . . . . . . . . . . . . . . . . . . . . . . 85

6.7.2. Traslacion . . . . . . . . . . . . . . . . . . . . . . . . . 85

6.7.3. Rotacion respecto al eje X . . . . . . . . . . . . . . . . 85

6.7.4. Rotacion respecto al eje Y . . . . . . . . . . . . . . . . 85

6.7.5. Rotacion respecto al eje Z . . . . . . . . . . . . . . . . 86

6.8. Rotacion respecto a un eje arbitrario . . . . . . . . . . . . . . 86

6.8.1. Determinacion de la Matriz de transformacion por Com-posicion de matrices . . . . . . . . . . . . . . . . . . . 86

INDICE GENERAL 5

6.8.2. Determinacion de la Matriz de transformacion por con-junto de vectores ortogonales . . . . . . . . . . . . . . 90

6.8.3. Determinacion de la Matriz de transformacion medi-ante Cuaterniones . . . . . . . . . . . . . . . . . . . . . 91

6.9. Transformaciones geometricas con OpenGL . . . . . . . . . . . 926.10. Manejo de pilas de matrices con OpenGL . . . . . . . . . . . . 93

7. Visualizacion 3D 957.1. Proyeccion en paralelo . . . . . . . . . . . . . . . . . . . . . . 957.2. Proyeccion en perspectiva . . . . . . . . . . . . . . . . . . . . 977.3. Pipeline de visualizacion tridimensional . . . . . . . . . . . . . 997.4. Volumen de vision . . . . . . . . . . . . . . . . . . . . . . . . 1007.5. Funciones de visualizacion tridimensional de OpenGL . . . . . 100

8. Supresion de Lıneas y Superficies ocultas 1038.1. Supresion de segmentos de lıneas ocultas . . . . . . . . . . . . 103

8.1.1. Algoritmo del horizonte flotante . . . . . . . . . . . . . 1048.2. Determinacion de la ecuacion de un plano . . . . . . . . . . . 1058.3. Determinacion del vector Normal a un Plano . . . . . . . . . . 1078.4. Deteccion de caras posteriores . . . . . . . . . . . . . . . . . . 107

8.4.1. Algoritmo de Roberts . . . . . . . . . . . . . . . . . . . 1078.5. Algoritmo del Buffer Z o Buffer de profundidad . . . . . . . . 1088.6. Algoritmo del Buffer A para superficies transparentes . . . . . 1098.7. Algoritmo del Buffer Z por lınea de rastreo . . . . . . . . . . . 1108.8. Metodo de proyeccion de rayos . . . . . . . . . . . . . . . . . . 1108.9. Metodo del arbol BSP . . . . . . . . . . . . . . . . . . . . . . 1118.10. Funciones de OpenGL para suprimir superficies ocultas . . . . 112

9. Iluminacion 1159.1. Reflexion Difusa . . . . . . . . . . . . . . . . . . . . . . . . . . 1159.2. Ecuacion de Lambert . . . . . . . . . . . . . . . . . . . . . . . 1169.3. Reflexion Especular . . . . . . . . . . . . . . . . . . . . . . . . 1189.4. Modelado de la Iluminacion . . . . . . . . . . . . . . . . . . . 1189.5. Determinacion del vector Normal a un vertice . . . . . . . . . 1209.6. Sombreado de Gourad . . . . . . . . . . . . . . . . . . . . . . 1219.7. Sombreado de Phong . . . . . . . . . . . . . . . . . . . . . . . 1229.8. Funciones de OpenGL para manejo de Iluminacion . . . . . . 1249.9. Iluminacion por proyeccion de Rayos . . . . . . . . . . . . . . 125

6 INDICE GENERAL

9.10. Radiosidad . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1299.11. Funciones de OpenGL para iluminacion . . . . . . . . . . . . . 132

Capıtulo 1

Introduccion

Estas notas fueron desarrolladas como apoyo a los estudiantes que cursanla materia de Graficacion en la Carrera de Ingenierıa en Computacion. El pro-grama de esta materia incluye temas de diversos libros los cuales son difıcilesde conseguir y de algunos artıculos cientıficos, las presentes notas son un com-pendio que se apega a los temas que indica el programa. Los ejemplos que seincluyen han sido desarrollados a mucho mayor detalle que lo que usualmenteaparece en la bibliografıa. Finalmente sucede sobre todo en los estudiantes deLicenciatura que se les dificulta la comprension de material escrito en Ingles,estas notas son un apoyo tambien para aquellos alumnos con dificultadesde lectura del ingles tecnico del area de Graficacion. Estas notas se encuen-tran a disposicion de los estudiantes o de cualquier interesado en los temasde este curso en http://lc.fie.umich.mx/∼camarena/NotasGraficacion.pdf.Se agradecen las observaciones y comentarios, favor de dirigirlos a [email protected]

Atentamente: Dr. Jose Antonio Camarena Ibarrola. Autor

7

8 CAPITULO 1. INTRODUCCION

Los algoritmos de graficacion resuelven problemas relacionados con lasaplicaciones graficas en donde una computadora digital es de gran ayuda.Ejemplos de tales aplicaciones son:

Despliegue de funciones matematicas de dos variables que difıcilmentese pueden dibujar a mano.

Realizacion de prototipos. Antes de construir un dispositivo, equipo oincluso automoviles y aviones es importante que sus disenos puedanapreciarse y corregirse de manera eficaz y economica.

Simulacion por computadora. Para saber si una solucion a un problemade ingenierıa realmente funciona resulta muy practico observar la solu-cion en accion, un ejemplo de esto son los simuladores de trafico dondeal construir digamos un distribuidor vial podemos validar su correctodiseno o jugar con el para hacerle mejoras

Video-juegos. Muchos programas de simulacion terminan luego convir-tiendose en video-juegos. Sin embargo, los video-juegos son una indus-tria por si misma que ha evolucionado a grandes pasos.

Animacion por computadora. En realidad los video-juegos son una ra-ma de la animacion por computadora donde el usuario interactua, sinembargo, la animacion por computadora ha permitido la produccionde pelıculas en menor tiempo, a menor costo y con mejores efectosespeciales.

Recorridos virtuales. La arquitectura se ha beneficiado de esta rama, enlugar de hacer una maqueta, un arquitecto puede disenar un inmuebley presentarlo a un cliente dandole un paseo virtual donde es posiblerealizar modificaciones a su gusto.

Capıtulo 2

Primitivas de Graficacion

2.1. Algoritmos de trazado de lıneas

La lınea recta tiene la forma:

y = mx + b (2.1)

donde m es la pendiente de la recta definida como:

m =∆y

∆x(2.2)

b es el punto donde la recta intersecta al eje y (la recta x = 0) y lapendiente m es grande si a un ∆x pequeno le corresponde un ∆y grandecomo se muestra en la Figura 2.1.

Si deseamos trazar una recta de (xini, yini) a (xfin, yfin), entonces:

m =yfin − yini

xfin − xini

(2.3)

En base a esto, podemos pensar en un algoritmo simple para trazar unarecta, el cual consiste en ir dando a x todos los valores enteros consecutivosdesde xini hasta xfin y para cada valor de x determinar el valor de y corre-spondiente. El k-esimo valor de y (yk) en terminos de xk (el k-esimo valor dex) esta dado por:

yk = mxk + b (2.4)

Para el siguiente calculo tendrıamos:

9

10 CAPITULO 2. PRIMITIVAS DE GRAFICACION

Figura 2.1: La recta

2.1. ALGORITMOS DE TRAZADO DE LINEAS 11

yk+1 = mxk+1 + b (2.5)

Como dijimos x se incrementa en uno cada vez por lo tanto:

xk+1 = xk + 1 (2.6)

Podemos entonces ahorrar calculos al expresar yk+1 en terminos de yk

como a continuacion:

yk+1 = m(xk + 1) + b = (mxk + b) + m (2.7)

De donde:

yk+1 = yk + m (2.8)

El algoritmo entonces consiste en hacer y1 = yini y luego hacer usarsucesivamente (2.8) y (2.6) hasta que xk sea igual a xfin

Input: xini,yini,xfin,yfin

Output: Traza Lınea rectaif xfin > xini then

swap(xfin,xini);swap(yfin,yini);

endk = 1;xk = xini;yk = yini ;plot(floor(xk),floor(yk));while xk ≤ xfin do

k = k + 1;yk = yk−1 + m;xk = xk−1 + 1;plot(floor(xk),floor(yk));

endAlgorithm 1: Algoritmo simple para trazar una recta

2.1.1. Algoritmo DDA (Digital Diferential Analizer)

El problema con el Algoritmo 1 simple de trazado de rectas es que amedida que cambia la pendiente de una recta, el numero de pixels cambia a


pesar de tratarse de rectas de la misma longitud, esto implica que la brillantezde la recta depende de su pendiente, para remediar esto, se debe elegir comovariable de rastreo a la variable que vaya a tener mayor variacion, es decir,si ∆x > ∆y se debe elegir a x como variable de rastreo y de lo contrario a y,nos referimos como variable de rastreo a la que se incrementa en uno en cadaiteracion, el Algoritmo DDA hace esto y hace uso de la funcion signo paraque el mismo codigo se pueda utilizar independientemente de la pendientede la recta o del cuadrante en el que se quiere trazar la recta.


Output: Traza Lınea rectaif |xfin − xini| ≥ |yfin − yini| then

longitud=|xfin − xini| ;else

longitud=|yfin − yini| ;end∆x = (xfin − xini)/longitud ;∆y = (yfin − yini)/longitud ;x = xini + 0,5 ∗ Signo(∆x) ;y = yini + 0,5 ∗ Signo(∆y) ;k = 1 ;while k ≤ longitud do

plot(floor(x),floor(y));x = x + ∆x;y = y + ∆y;k = k + 1;

endAlgorithm 2: Algoritmo DDA

2.1.2. Algoritmo de Bresenham

El problema con el Algoritmo DDA es que hace uso de aritmetica depunto flotante y eso lo hace lento y difıcil de implementar en hardware. Elalgoritmo de Bresenham [1] hace uso de aritmetica entera, para entenderloveamos primero una version preliminar que todavıa utiliza flotantes. Si sequiere trazar una recta en el primer octante, entonces la pendiente es unvalor entre 0 y 1, en tal caso, realmente en cada paso solo x se incrementa yrespecto a y solo tenemos que decidir si y se incrementa o se queda igual.

Llamamos error e a la distancia entre la lınea ideal que se desea trazar

2.1. ALGORITMOS DE TRAZADO DE LINEAS 13

y el pixel que queda mas cerca de dicha lınea, si el pixel mas cercano quedapor arriba de la lınea el error sera positivo y si el pixel mas cercano quedapor debajo de la lınea el error sera negativo. El algoritmo de Bresenham haceuso solo de dicho signo para decidir cual pixel debe elegirse, si se elige noincrementar y, el error se acumula y si se incrementa y se le resta 1 al error,a continuacion se muestra el algoritmo de Bresenham en su version simpleque usa flotantes


Output: Traza Lınea rectax = xini;y = yini;∆x = xfin − xini ;∆y = yfin − yini ;e = ∆y/∆x− 1/2 ;for i = 1 to ∆x do

Plot(floor(x),floor(y));while e ≥ 0 do

y = y + 1;e = e− 1;

endx = x + 1;e = e + ∆y/∆x;

endAlgorithm 3: Algoritmo Bresenham que usa flotantes

Para convertir este algoritmo en uno que solo use flotantes usamos e =2e∆x de manera que en el Algoritmo 3, la lınea:e = ∆x/∆y − 1/2se convierte en:

2e∆x = 2∆y −∆x

es decir en la lınea:

e = 2∆y −∆x

Mientras que la lınea:

e = e− 1


se convierte en:

2e∆x = 2e∆x− 2∆x

es decir:

e = e− 2∆x

Finalmente, la lınea:

e = e + ∆y/∆x

se convierte en:

2e∆x = 2e∆x + 2∆y

es decir:

e = e + 2∆y

El algoritmo de trazado de lıneas rectas para el primer octante que soloutiliza aritmetica entera queda:

2.2. ALGORITMOS DE TRAZADO DE CIRCUNFERENCIAS 15


Output: Traza Lınea rectax = xini;y = yini;∆x = xfin − xini ;∆y = yfin − yini ;e = 2∆y −∆x ;for i = 1 to ∆x do

Plot(x,y);while e ≥ 0 do

y = y + 1;e = e− 2∆x;

endx = x + 1;e = e + 2∆y ;

endAlgorithm 4: Algoritmo Bresenham para el primer octante, solo usa ar-itmetica entera

El algoritmo 4 solo funciona en el primer octante.

2.2. Algoritmos de trazado de circunferencias

La ecuacion de una circunferencia con radio R y centrada en (xc, yy) es:

(x− xc)2 + (y − yc)

2 = R2 (2.9)

Si despejamos y de la ecuacion anterior tendremos:

y =√

R2 − (x− xc)2 + yc (2.10)

El metodo mas simple para trazar una circunferencia de radio R y centroen (xc, yc) consiste en asignar a x todos los valores enteros consecutivos desdexc−R hasta xc +R y por cada valor de x determinar el correspondiente valorde y mediante la ecuacion (2.10), la cual por cierto regresa en realidad dosvalores por lo que cada valor de x determina dos puntos de la circunferencia.El algoritmo serıa el siguiente:


Input: xc,yc,ROutput: Traza Circunferencia de radio R y centro en (xc, yc)x = xc −R;while x ≤ xc + R do

y1 =√

R2 − (x− xc)2 + yc;

y2 = −√

R2 − (x− xc)2 + yc;Plot(floor(x),floor(y1));Plot(floor(x),floor(y2));x = x + 1;

endAlgorithm 5: Algoritmo simple para trazar un cırculo de radio R centradoen (xc, yc)

Al utilizar el algoritmo 5, la circunferencia luce bien en la parte superior yen la inferior pero en la parte izquierda y derecha no se queda muy bien defini-da pues en esta parte se encienden menos pixels. Para remediar esto, se puedecambiar el rol de x y y en los octantes 1,4,5 y 8. Aun ası podrıamos observarque la brillantez de la circunferencia no es homogenea, para remediar esto sepuede utilizar las ecuaciones parametricas que definen la circunferencia:

x = Rcos(θ) + xc

y = Rsen(θ) + yc

(2.11)

El procedimiento consiste entonces en darle un valor inicial a θ de cero eincrementarlo gradualmente hasta 2π, de esta manera generamos un circuloque luce homogeneo.

2.2.1. Algoritmo de Bresenham para trazado de cir-cunferencias

Los dos procedimientos planteados en esta seccion utilizan demasiadasoperaciones, sobre todo de aritmetica de punto flotante, cuando deseamostrazar cientos de cırculos, comenzamos a pensar en que debemos encontraruna forma mas eficiente de hacerlo.

Estamos de acuerdo en que si somos capaces de trazar el cırculo en elorigen, moverlo de manera en que su centro quede ubicado en (xc, yc) im-plica simplemente sumar xc a todas las coordenadas x y sumar yc a todas

2.2. ALGORITMOS DE TRAZADO DE CIRCUNFERENCIAS 17

las coordenadas y, por lo tanto, podemos despreocuparnos por ahora de laposicion de la circunferencia e implementar un algoritmo que solo requiera elparametro R.

Si aprovechamos la simetrıa de un cırculo ubicado en el origen, podemossimplemente determinar cuales pixels se deberıan encender en un octante yen el resto de los octantes encender los que ocupan las posiciones simetri-cas correspondientes, ası despues de encender el pixel (x,y) procedemos aencender los pixels (x,-y),(-x,y),(-x,-y), (y,x),(y,-x),(-y,x) y (-y,-x).

El algoritmo de Bresenham se encarga de determinar los pixels que habrıaque encender en el segundo octante utilizando para ello solo aritmetica entera,x comienza entonces con el valor de cero y y con el valor de R, se procedeentonces incrementando x de uno en uno, en ese octante, y tiene solo dosposibilidades, se decrementa o mantiene su valor, al igual que el algoritmo deBresenham para trazar lıneas, utiliza solo el signo del error para decidir. Elalgoritmo del punto medio es una simplificacion del algoritmo de Bresenhamy lo describiremos a detalle a continuacion

2.2.2. Algoritmo del punto medio para trazado de cir-cunferencias

La funcion fcirc(x, y) define si el punto de coordenadas (x,y) se encuentradentro o fuera del cırculo de radio R centrado en el origen, la definicion formalserıa:

fcirc(x, y) = x2 + y2 −R2 =

< 0 (x,y) esta dentro del cırculo

0 (x,y) esta justo en el cırculo

> 0 (x,y) esta fuera del cırculo

(2.12)

Al trazar el segmento de cırculo correspondiente al segundo octante en elsentido de las manecillas del reloj, x comienza con el valor cero y se incre-menta en uno en cada paso de manera que:

xk+1 = xk + 1 (2.13)

La y por otro lado, comienza con el valor R y en cada paso se debe decidirsi mantiene su valor, es decir si yk+1 = yk o si se debe decrementar su valoren uno, es decir si yk+1 = yk − 1. Para decidirlo, evaluamos la funcion fcirc


en el punto medio, es decir, determinamos pk = fcirc(xk + 1, yk − 1/2), estolo hacemos en cada paso. El signo de pk nos indica si el punto medio entre(xk + 1, yk) y (xk + 1, yk − 1) queda dentro del cırculo (pk < 0) en cuyo casodebemos hacer yk+1 = yk ya que el pixel (xk + 1, yk) queda mas cerca delcirculo ideal que el pixel (xk +1, yk− 1). Si por el contrario, pk > 0, entoncesel punto medio queda fuera del circulo ideal y debemos elegir (xk +1, yk−1).Si pk = 0, entonces en realidad no importa cual de los dos pixels se escoja.

Para economizar calculos podemos expresar pk+1 recursıvamente, es decir,en terminos de pk:

pk+1 = (xk+1 + 1)2 + (yk+1 − 1/2)2 −R2 (2.14)

Como se explico, si pk ≤ 0, entonces yk+1 = yk, entonces:

pk+1 = ((xk + 1) + 1)2 + (yk − 1/2)2 −R2

= (xk + 1)2 + 2(xk + 1) + 1 + (yk − 1/2)2 −R2

= 2pk + 2xk + 3 = 2pk + 2xk+1 + 1 (2.15)

si en cambio, pk > 0, entonces yk+1 = yk − 1, entonces:

pk+1 = ((xk + 1) + 1)2 + ((yk − 1)− 1/2)2 −R2

= (xk + 1)2 + 2(xk + 1) + 1 + ((yk − 1/2)− 1)2 −R2

= (xk + 1)2 + 2(xk + 1) + 1 + (yk − 1/2)2 − 2(yk − 1/2) + 1−R2

= [(xk + 1)2 + (yk − 1/2)2 −R2] + 2xk+1 + 1− 2yk + 2

= pk + 2xk+1 − 2yk+1 + 1 (2.16)

Al inicio x0 = 0 y y0 = R, entonces:

p0 = 1 + (R− 1/2)R2 −R2

= 1 + R2 −R + 1/4−R2

= 5/4−R (2.17)

Como queremos utilizar solo aritmetica entera aproximamos p0 ≈ 1−REl algoritmo del punto medio para trazar un cırculo de radio R en el

origen es:

2.3. ALGORITMOS DE GENERACION DE ELIPSES 19

Input: xc,yc,ROutput: Traza Circunferencia de radio R centrada en (xc, yc

x = 0;y = R;p=1-R;while x ≤ y do

Plot(xc + x, yc + y);Plot(xc + x, yc − y);Plot(xc − x, yc + y);Plot(xc − x, yc − y);Plot(xc + y, yc + x);Plot(xc + y, yc − x);Plot(xc − y, yc + x);Plot(xc − y, yc − x);x = x + 1;if p ≤ 0 then

p=p+2x+1;else

y=y-1;p=p+2x-2y+1;

end

endAlgorithm 6: Algoritmo del punto medio para trazar un cırculo de radioR centrado en (xc, yc)

2.3. Algoritmos de generacion de elipses

La ecuacion de una elipse con radios Rx y Ry, centrada en (xc, yy) es:

(x− xc)2

R2x

+(y − yc)

2

R2y

= 1 (2.18)

Esta ecuacion se reduce a la de una circunferencia cuando Rx = Ry.

Si despejamos y de la ecuacion anterior tendremos:

y =

√R2

y −R2

y

R2x

(x− xc)2 + yc (2.19)


El metodo mas simple para trazar una elipse de radios Rx y Ry centradaen (xc, yc) consiste en asignar a x todos los valores enteros consecutivos desdexc − Rx hasta xc + Rx y por cada valor de x determinar el correspondientevalor de y mediante la ecuacion (2.19), la cual por cierto regresa en realidaddos valores por lo que cada valor de x determina dos puntos de la elipse. Elalgoritmo serıa el siguiente:

Input: xc,yc,Rx,Ry

Output: Traza elipse de radios Rx y Ry con centro en (xc, yc)x = xc −Rx;while x ≤ xc + Rx do

y1 =√

R2y − R2

y

R2x(x− xc)2 + yc;

y2 = −√

R2y − R2

y

R2x(x− xc)2 + yc;

Plot(floor(x),floor(y1));Plot(floor(x),floor(y2));x = x + 1;

endAlgorithm 7: Algoritmo simple para trazar una elipse de radios Rx y Ry

centrada en (xc, yc)

Al utilizar el algoritmo 7, la elipse luce bien en la parte superior y en lainferior pero en la parte izquierda y derecha no se queda muy bien definidapues en esta parte se encienden menos pixels, para remediar esto se puedeutilizar las ecuaciones parametricas que definen la elipse:

x = Rxcos(θ) + xc

y = Rysen(θ) + yc

(2.20)

El procedimiento consiste entonces en darle un valor inicial a θ de cero eincrementarlo gradualmente hasta 2π, de esta manera generamos una elipseque luce homogenea.

2.3.1. Algoritmo de Bresenham para generacion de elipses

Los dos procedimientos planteados en esta seccion utilizan demasiadasoperaciones, sobre todo de aritmetica de punto flotante, cuando deseamos


trazar cientos de elipses, comenzamos a pensar en que debemos encontraruna forma mas eficiente de hacerlo.

Estamos de acuerdo en que si somos capaces de trazar la elipse en el ori-gen, moverla de manera en que su centro quede ubicado en (xc, yc) implicasimplemente sumar xc a todas las coordenadas x y sumar yc a todas las coor-denadas y, por lo tanto, podemos despreocuparnos por ahora de la posicionde la elipse e implementar un algoritmo que solo requiera los parametro Rx

y Ry.Si aprovechamos la simetrıa de una elipse ubicada en el origen, podemos

simplemente determinar cuales pixels se deberıan encender en un cuadrante yen el resto de los cuadrantes encender los que ocupan las posiciones simetri-cas correspondientes, ası despues de encender el pixel (x,y) procedemos aencender los pixels (x,-y),(-x,y),(-x,-y).

El algoritmo de Bresenham se encarga de determinar los pixels que habrıaque encender en el primer cuadrante utilizando para ello solo aritmetica en-tera, x comienza entonces con el valor de cero y y con el valor de Ry, seprocede entonces incrementando x de uno en uno, desde que la pendiente dela elipse es de cero hasta que la pendiente es de -1, entonces se cambian losroles de x y y, al igual que el algoritmo de Bresenham para trazar circun-ferencias, utiliza solo el signo del error para decidir. El algoritmo del puntomedio es una simplificacion del algoritmo de Bresenham y lo describiremosa detalle a continuacion

2.3.2. Algoritmo del punto medio para generacion deelipses

La funcion felip(x, y) define si el punto de coordenadas (x,y) se encuentradentro o fuera de la ellipse de radios Rx y Ry centrado en el origen, ladefinicion formal serıa:

felip(x, y) = R2yx

2 + R2xy

2 −R2xR

2y =

< 0 (x,y) esta dentro de la elipse

0 (x,y) esta justo en la elipse

> 0 (x,y) esta fuera de la elipse

(2.21)La derivada de la elipse en el punto x, y se puede obtener mediante el

metodo de derivada total de una funcion implıcita, es decir, para una funcionf(x, y) = 0 la derivada total es:


∂f(x, y)

∂xdx +

∂f(x, y)

∂ydy = 0 (2.22)

Aplicado a la ecuacion de la elipse, obtenemos:

2x

R2x

dx +2y

R2y

dy = 0 (2.23)

Despejando dy/dx obtenemos:

dy

dx= −R2

yx

R2xy

(2.24)

Se comienza trazando el segmento de elipse que comienza en x = 0 yy = Ry donde dy/dx = 0 y se incrementa x de uno en uno en cada paso demanera que:

xk+1 = xk + 1 (2.25)

En cada paso se debe decidir si y mantiene su valor, es decir si yk+1 = yk

o si se debe decrementar su valor en uno, es decir si yk+1 = yk − 1. Paradecidirlo, evaluamos la funcion felip en el punto medio, es decir, determinamosp1k = felip(xk + 1, yk − 1/2), esto lo hacemos en cada paso. El signo de p1k

nos indica si el punto medio entre (xk +1, yk) y (xk +1, yk− 1) queda dentrode la elipse (p1k < 0) en cuyo caso debemos hacer yk+1 = yk ya que el pixel(xk + 1, yk) queda mas cerca de la elipse ideal que el pixel (xk + 1, yk − 1). Sipor el contrario, p1k > 0, entonces el punto medio queda fuera de la elipseideal y debemos elegir (xk + 1, yk − 1). Si p1k = 0, entonces en realidad noimporta cual de los dos pixels se escoja. En cada paso de este procedimientose debe evaluar la derivada mediante la ecuacion (2.24), cuando la derivadatenga un valor inferior a -1 debemos cambiar los roles que juegan x y y.

Para economizar calculos podemos expresar p1k+1 recursıvamente, es de-cir, en terminos de p1k:

p1k+1 = (xk+1 + 1)2R2y + (yk+1 − 1/2)2R2

x −R2xR

2y (2.26)

Como se explico, si p1k ≤ 0, entonces yk+1 = yk, entonces:


p1k+1 = ((xk + 1) + 1)2R2y + (yk − 1/2)2R2

x −R2xR

2y

= (xk + 1)2R2y + 2(xk + 1)R2

y + R2y + (yk − 1/2)2R2

x + R2xR

2y

= p1k + 2(xk + 1)R2y + R2

y

= p1k + 2xk+1R2y + R2

y (2.27)

si en cambio, p1k > 0, entonces yk+1 = yk − 1, entonces:

p1k+1 = ((xk + 1) + 1)2R2y + ((yk − 1)− 1/2)2R2

x −R2xR

2y

= (xk + 1)2R2y + 2(xk + 1)R2

y + R2y + (yk − 1/2)2R2

x − 2(yk − 1/2)R2x + R2

x + R2xR

2y

= p1k + 2(xk + 1)R2y + R2

y − 2(yk − 1/2)R2x + R2

x

= p1k + 2xk+1R2y + R2

y − 2ykR2x + R2

x + R2x

= p1k + 2xk+1R2y + R2

y − 2ykR2x + 2R2

x

= p1k + 2xk+1R2y + R2

y − 2R2x(yk − 1)

= p1k + 2xk+1R2y + R2

y − 2R2xyk+1 (2.28)

Al inicio x0 = 0 y y0 = Ry, entonces:

p10 = R2y + (Ry − 1/2)2R2

x −R2xR

2y

= R2y + R2

yR2x −RyR

2x +

1

4R2

x −R2xR

2y

= R2y −RyR

2x +

1

4R2

x

(2.29)

Cuando la pendiente de la elipse es inferior a -1, comenzamos a trazar lasegunda parte de la elipse del primer cuadrante, en esta region,

y se decrementa de uno en uno en cada paso de manera que:

yk+1 = yk − 1 (2.30)

En cada paso se debe decidir si x mantiene su valor, es decir si xk+1 = xk

o si se debe incrementar su valor en uno, es decir si xk+1 = xk + 1. Paradecidirlo, evaluamos la funcion felip en el punto medio, es decir, determinamos


p2k = felip(xk + 1/2, yk − 1), esto lo hacemos en cada paso. El signo de p2k

nos indica si el punto medio entre (xk, yk) y (xk + 1, yk − 1) queda dentro dela elipse (p2k < 0) en cuyo caso debemos hacer xk+1 = xk + 1 ya que el pixel(xk+1, yk+1) queda mas cerca de la elipse ideal que el pixel (xk, yk−1). Si porel contrario, p2k > 0, entonces el punto medio queda fuera de la elipse idealy debemos elegir (xk, yk − 1). Si p2k = 0, entonces en realidad no importacual de los dos pixels se escoja.

Para economizar calculos podemos expresar p2k+1 recursıvamente, es de-cir, en terminos de p2k:

p2k+1 = (xk+1 + 1/2)2R2y + (yk+1 − 1)2R2

x −R2xR

2y (2.31)

Como se explico, si p2k ≤ 0, entonces xk+1 = xk + 1, entonces:

p2k+1 = ((xk + 1) + 1/2)2R2y + (yk − 1− 1)2R2

x −R2xR

2y

= (xk + 1/2)2R2y + 2(xk + 1/2)R2

y + R2y + (yk − 1)2R2

x − 2(yk − 1)R2x + R2

x −R2xR

2y

= p2k + 2xkR2y + R2

y + R2y − 2(yk − 1)R2

x + R2x

= p2k + 2xkR2y + 2R2

y − 2ykR2x + 2R2

x + R2x

= p2k + 2xk+1R2y − 2yk+1R

2x + R2

x (2.32)

si en cambio, p2k > 0, entonces xk+1 = xk, entonces:

p2k+1 = (xk + 1/2)2R2y + (yk − 1− 1)2R2

x −R2xR

2y

= (xk + 1/2)2R2y + (yk − 1)2R2

x − 2(yk − 1)R2x + R2

x −R2xR

2y

= p2k − 2(yk − 1)R2x + R2

x

= p2k − 2ykR2x + 2R2

x + R2x

= p2k − 2yk+1R2x + R2

x (2.33)

El algoritmo del punto medio para trazar una elipse de radios Rx y Ry

en el origen es:


Input: xc,yc,Rx,Ry

Output: Traza elipse de radios Rx, Ry centrada en (xc, yc

x = 0;y = Ry;p1 = R2

y −RyR2x + 1

4R2

x;

while 2R2yx ≤ 2R2

xy doPlot(xc + x, yc + y);Plot(xc + x, yc − y);Plot(xc − x, yc + y);Plot(xc − x, yc − y);x = x + 1;if p1 ≤ 0 then

p1 = p1 + 2xR2y + R2

y;

elsey=y-1;p1 = p1 + 2xR2

y + R2y − 2R2

xy;

end

endp2 = R2

y(x + 1/2)2 + R2x(y − 1)2 −R2

xR2y;

while y > 0 doy = y − 1;if p2 ≤ 0 then

x = x + 1;p2 = p2 + 2xR2

y − 2R2xy + R2

x;

elsep2 = p2− 2yR2

x + R2x;

endPlot(xc + x, yc + y);Plot(xc + x, yc − y);Plot(xc − x, yc + y);Plot(xc − x, yc − y);

endAlgorithm 8: Algoritmo del punto medio para trazar una elipse de radiosRx,Ry centrada en (xc, yc)


2.4. Polilıneas

Una polilınea es una figura que como su nombre lo indica consta de variaslıneas rectas, estas lıneas estan conectadas y ordenadas de manera que el fi-nal coincide con el inicio de la segunda, el final de la segunda coincide conel inicio de la tercera y ası sucesivamente. Existen dos tipos de polilıneas, enlas cerradas el final de la ultima lınea coincide con el inicio de la primera for-mando ası una figura cerrada que puede por ejemplo rellenarse. Las polilıneasabiertas no forman polıgonos sino que forman simplemente lıneas quebradasque pueden usarse para definicion de extremos u otras aplicaciones.

2.5. Curvas Splines cubicas naturales

Un spline solıa ser un instrumento utilizado por dibujantes para hacercurvas suaves, consistıa en una banda flexible que se hacıa pasar por pun-tos especıficos, actualmente una spline es una curva formada por segmentospolinomiales que satisfacen condiciones de continuidad entre ellos. Podemosclasificar a las splines como:

1. Splines de Interpolacion. Aquellas que pasan justo por los puntos decontrol

2. Splines de Aproximacion. Aquellas que pasan cerca de los puntos decontrol

En cualquier caso, los puntos de control definen un polıgono donde elspline queda confinado.

Las condiciones de continuidad pueden ser:

1. Continuidad parametrica. Si las derivadas parametricas al final de ca-da segmento coincide exactamente con las derivadas parametricas alinicio del siguiente segmento. Dependiendo de la mayor derivada en laque se exige esto, decimos que es continuidad C0, C1 o C2, si se ex-ige coincidencia con la derivada cero (Continuidad de orden cero), laprimer derivada (Continuidad de primer orden) o la segunda derivada(Continuidad de segundo orden)

2. Continuidad geometrica. Si las derivadas de cada para de segmentos sonproporcionales (no necesariamente iguales) en su frontera comun. Les

2.5. CURVAS SPLINES CUBICAS NATURALES 27

denominamos G0, G1 o G2 para referirnos a la continuidad geometricade orden cero, primero y segundo respectivamente.

Los splines cubicos naturales tienen continuidad C2. Si tenemos n puntosde control, entonces tenemos n segmentos cubicos y por tanto 4n coeficientesque determinar. En cada uno de los n-1 puntos de control interiores tenemos4 condiciones de continuidad (una para hacer coincidir el final de un seg-mento con el punto de control, otra para que el inicio del siguiente segmentotambien pase por el punto de control, una mas para hacer coincidir la primeraderivada y otra mas para la segunda derivada). De ahı que obtengamos 4n-4ecuaciones, obtenemos una ecuacion mas para que el primer segmento inicieen el primer punto de control y otra ecuacion para que el ultimo segmentotermine en el ultimo punto de control. Por lo tanto necesitamos dos ecua-ciones mas, una alternativa de solucion consiste en especificar las derivadasde primer orden del primero y del ultimo punto de control. Otra alternativaes agregar dos puntos de control ficticios adicionales (uno antes del primeroy otro despues del ultimo)

El problema con las splines cubicas naturales es que si cualquiera de lospuntos de control es modificado, la curva completa (todos los segmentos)deben ser re-calculados, es decir, los splines naturales no permiten controllocal.

2.5.1. Splines de Hermite

Las Splines de Hermite permiten control local porque cada segmento dela curva solo depende de las restricciones de sus puntos extremos.

Si P(u) representa la curva parametrica que inicia en el punto de controlpk y termina en pk+1, entonces, las restricciones que definen la curva en esesegmento son:

P (0) = pk

P (1) = pk+1

P ′(0) = DPk (2.34)

P ′(1) = DPk+1

El polinomio parametrico P (u) es:


P (u) = au3 + bu2 + cu + d (2.35)

O bien:

P (u) = [ u3 u2 u 1 ]

abud

(2.36)

P ′(u) es:

P (u) = 3au2 + 2bu + c (2.37)

O bien:

P (u) = [ 3u2 2u 1 0 ]

abud

(2.38)

Es claro que P (0) = d y que P (1) = a + b + c + d, ademas P ′(0) = c yP ′(1) = 3a+2b+c, por lo tanto las restricciones para la curva en el segmentoque va de pk a pk+1 se pueden expresar como:

pk

pk+1

DPk

DPk+1

=

0 0 0 11 1 1 10 0 1 03 2 1 0

abcd

(2.39)

Resolviendo este sistema de ecuaciones obtenemos:

abcd

=

2 −2 1 1−3 3 −2 −10 0 1 01 0 0 0

pk

pk+1

DPk

DPk+1

(2.40)

abcd

= MH

pk

pk+1

DPk

DPk+1

(2.41)

MH es la matriz de Hermite


P (u) =[

u3 u2 u 1]

2 −2 1 1−3 3 −2 −10 0 1 01 0 0 0

pk

pk+1

DPk

DPk+1

(2.42)

P (u) =[

u3 u2 u 1]

2pk − 2pk+1 + DPk + DPk+1

3pk − 3pk+1 − 2DPk −DPk+1

DPk

pk

(2.43)

P (u) = u3(2pk−2pk+1+DPk+DPk+1)+u2(3pk−3pk+1−2DPk−DPk+1)+uDPk+pk

(2.44)Reagrupando:

P (u) = pk(2u3−3u2+1)+pk+1(−2u3+3u2)+DPk(u

3−2u2+u)+DPk+1(u3−u2)(2.45)

P (u) = pkH0(u) + pk+1H1(u) + DPkH2(u) + DPk+1H3(u) (2.46)

En la Figura 2.2 se presentan las funciones H0(u), H1(u), H2(u) y H3(u):

El problema con la utilizacion de las splines de Hermite es que estasrequieren de la especificacion de las derivadas en cada punto de control, pararemediar este problema, las splines cardinales realizan una estimacion dedichas derivadas mediante:

P ′(0) =1

2(1− t)(pk+1 − pk−1) (2.47)

P ′(1) =1

2(1− t)(pk+2 − pk) (2.48)

donde t es un parametro que define la tension de los segmentos de cadaspline cardinal


0 0.2 0.4 0.6 0.8 10

0.2

0.4

0.6

0.8

1H0

0 0.2 0.4 0.6 0.8 10

0.2

0.4

0.6

0.8

1H1

0 0.2 0.4 0.6 0.8 1−0.2

0

0.2

0.4

0.6

0.8

H2

0 0.2 0.4 0.6 0.8 1−0.2

0

0.2

0.4

0.6

0.8

H3

Figura 2.2: Funciones de Hermite


2.5.2. Curvas de Bezier

Estas splines de aproximacion inventadas por el Ingeniero Pierre Bezierpara el diseno de carrocerıas Renault no requieren de la especificacion de pen-dientes en los puntos de control ni de agregar puntos adicionales ni de ningunparametro de tension. Por su simplicidad son muy populares y aparecen enmuchos paquetes de dibujo y de pintura.

El polinomio que describe la posicion (en dos o en tres dimensiones) decada punto que conforma una curva de Bezier para los n puntos de controlque la definen es:

P (u) =n∑

k=0

pkBk,n(u) (2.49)

Donde Bk,n(u) es la k-esima funcion de combinacion para n + 1 puntosde control (p0, p1, ..., pn) y estan definidas como:

Bk,n(u) =

(n

k

)uk(1− u)n−k (2.50)

Por ejemplo, para 4 puntos de control, tendrıamos las cuatro funcionesde combinacion siguientes:

B0,3(u) = (1− u)3

B1,3(u) = 3u(1− u)2

B2,3(u) = 3u2(1− u)

B3,3(u) = u3 (2.51)

Estas funciones se muestran en la Figura 2.3, en la esquina superiorizquierda se muestra B0,3, en la esquina superior derecha se muestra B1,3, enla esquina inferior izquierda se muestra B2,3 y en la esquina inferior derechase muestra B3,3.

2.5.3. Splines B

Las Splines B son posiblemente las splines mas utilizadas [2], al igualque las curvas de Bezier son splines de aproximacion, presentan 2 ventajasrespecto a las splines de Bezier:


0 0.2 0.4 0.6 0.8 10

0.2

0.4

0.6

0.8

1

0 0.2 0.4 0.6 0.8 10

0.1

0.2

0.3

0.4

0.5

0 0.2 0.4 0.6 0.8 10

0.1

0.2

0.3

0.4

0.5

0 0.2 0.4 0.6 0.8 10

0.2

0.4

0.6

0.8

1

Figura 2.3: Funciones de Combinacion de Bezier para 4 puntos de control


1. El grado del polinomio no tiene que aumentar al aumentar el numerode puntos de control

2. Cada punto de control tiene un efecto mas local y por ende se tiene unmejor control acerca de la forma de la curva

A cambio, las splines B son mas complicadas que las splines de Bezier.Una spline B se define mediante la funcion:

P (u) =n∑

k=0

pkBk,d(u) umin ≤ u ≤ umax (2.52)

donde pk es el k-esimo punto de control del total de n + 1 puntos decontrol. Las funciones de combinacion Bk,d son polinomios de grado d − 1,el parametro d puede tomar cualquier valor entre 2 y n − 1, para d = 2 la“curva” es en realidad una polilınea. A diferencia de las Splines de Bezier, elparametro de control u no necesariamente varia de 0 a 1 y el control local selogra definiendo funciones de combinacion sobre subıntervalos del intervalototal de variacion de u. Las funciones de combinacion se definen mediantelas formulas recursivas de Cox-deBoor:

Bk,1 =

1 uk ≤ u ≤ uk+1

0 de lo contrario

Bk,d =u− uk

uk+d−1 − uk

Bk,d−1 +uk+d − u

uk+d − uk+1

Bk+1,d−1 (2.53)

Cada funcion de combinacion esta definida sobre d subintervalos y a cadavalor extremo del intervalo se le denomina nudo, el conjunto de nudos sedenomina vector de nudos. Se puede elegir cualquier conjunto de valores comonudos mientras estos esten en el intervalo de umin a umax, esta formulacionrequiere que en las formulas recursivas de Cox-deBoor cualquier evaluacionde 0/0 se le asigne el valor de 0.

Algunas propiedades de las Splines B son:

para n + 1 puntos de control tenemos n + 1 funciones funciones decombinacion

Cada funcion de combinacion de define sobre d subintervalos comen-zando por el nodo de valor uk


el vector de nodos tiene n+d+1 elementos definiendo n+d subintervalos

Cada seccion de la curva se ve influenciada por d puntos de control

cada punto de control afecta a lo mas a d secciones de la curva

2.5.3.1. Splines B uniformes

Cuando el espaciado entre valores de nodos es uniforme (Ej -1.5, -1.0,-0.5, 0.0, 0.5, 1.0, 1.5), la curva resultante es una Spline B uniforme. Elvector de nodos se puede normalizar para tener valores entre 0 y 1 (Ej.0,0, 0,2, 0,4, 0,6, 0,8, 1,0), sin embargo, por facilidad es comun usar valorenteros consecutivos partiendo de 0 (Ej. 0, 1, 2, 3, 4, 5, 6, 7).

Una ventaja de los Splines B uniformes es que las funciones de combi-nacion son periodicas, esto significa que todas las funciones de combinaciontienen la misma forma, cada una es simplemente una version desplazada dela anterior:

Bk,d(u) = Bk+1,d(u + ∆u) = Bk+2,d(u + 2∆u) (2.54)

donde ∆u es el intervalo entre nodos adyacentes

Para ejemplificar considere el caso en que n = d = 3, entonces el vectorde nodos que define n + d = 6 subıntervalos debe tener n + d + 1 = 7 valores(0, 1, 2, 3, 4, 5, 6). Cada funcion de combinacion abarca d = 3 subintervalos,utilizando la recurrencia de Cox-deBoor obtenemos:

B0,3(u) =u− 0

2− 0B0,2(u) +

3− u

3− 1B1,2(u)

=u

2

[u− 0

1− 0B0,1(u) +

2− u

2− 1B1,1(u)

]+

3− u

2

[u− 1

2− 1B1,1(u) +

3− u

3− 2B2,1(u)

]

=

12u2 0 ≤ u < 1

12u(2− u) + 1

2(3− u)(u− 1) 1 ≤ u < 2

12(3− u)2 2 ≤ u < 3

(2.55)

El resto de las funciones de combinacion se obtienen aprovechando laperiodicidad, ed decir:


B1,3(u) = B0,3(u− 1) (2.56)

=

12(u− 1)2 1 ≤ u < 2

12(u− 1)(3− u) + 1

2(4− u)(u− 2) 2 ≤ u < 3

12(4− u)2 3 ≤ u < 4

(2.57)

B2,3(u) = B1,3(u− 1) (2.58)

=

12(u− 2)2 2 ≤ u < 3

12(u− 2)(4− u) + 1

2(5− u)(u− 3) 3 ≤ u < 4

12(5− u)2 4 ≤ u < 5

(2.59)

B3,3(u) = B2,3(u− 1) (2.60)

=

12(u− 3)2 3 ≤ u < 4

12(u− 3)(5− u) + 1

2(6− u)(u− 4) 4 ≤ u < 5

12(6− u)2 5 ≤ u < 6

(2.61)

Todas las funciones de combinacion existen en el intervalo que esta definidodesde ud−1 = 2 hasta un+1 = 4, solo en ese intervalo se cumple el requerim-iento de que:

n∑

k=0

Bk,d(u) = 1 (2.62)

La curva inicia cuando u = 2 y termina cuando u = 4, en el primersegmento:

p0

[1

2(3− u)2

]+ p1

[1

2(u− 1)(3− u) +

1

2(u− 2)(4− u)

]+ p2

[1

2(u− 2)2

]

(2.63)en el extremo inicial de la cual u = 2

Pini = p0

[1

2

]+ p1

[1

2

]=

p0 + p1

2(2.64)


mediante un analisis similar concluimos que

Pfin =p2 + p3

2(2.65)

Con esto concluimos que el punto inicial de la Spline B uniforme estajusto enmedio de los puntos de control p0 y p1, mientras que el final de laspline esta a la mitad del penultimo y el ultimo punto de control (p2 y p3)

2.6. Estructura de un Programa OpenGL

Java OpenGL (JOGL) es una biblioteca que permite acceder a OpenGLmediante programacion en Java. Actualmente esta siendo desarrollado porel Game Technology Group de Sun Microsystems, y es la implementacion dereferencia para JSR-231 (Java Bindigs for OpenGL).

JOGL permite acceder a la mayorıa de caracterısticas disponibles para losprogramadores de C, con la excepcion de las llamadas a ventanas realizadasen GLUT (ya que Java contiene sus propios sistemas de ventanas, AWT ySwing), y algunas extensiones de OpenGL.

Para trabajar con JoGL descargarhttps://jogl.dev.java.net/files/documents/27/947/jogl-linux.tar.gzDescomprimir y agregar jogl.jar al directorio lib/ext/ del SDK o JRE in-

stalado, alternativamente, agregar jogl.jar a la variable CLASSPATH. Agre-gar el archivo jogl.dll al directorio bin/ del SDK o JRE instalado, alternati-vamente, copiarlo al directorio de trabajo.

El programa Java debe importar las clases del paquete JoGL incluidas enel archivo archivo jogl.jar, para ello use la directiva:

import net.java.games.jogl.*

Para hacer un programa en Java con salida grafica es usual utilizar laclase java.awt.Frame.

public static void main(String[] args)

Frame frame = new Frame("Hello World");

Una vez creada la ventana/frame debemos agregarle un GLCanvas o unGLJPanel al frame para poder utilizar los servicios de OpenGL. Podemosutilizar el metodo factory para crear el GLCanvaso el GLJPanel, luego lo

2.6. ESTRUCTURA DE UN PROGRAMA OPENGL 37

agregamos al frame de esta forma podemos combinar las capacidades deOpenGL con las de la GUI de Java.

El metodo factory requiere que se le especifiquen las “capabilities” delcanvas/panel, para nuestro proposito especificaremos las capacidad por de-fecto de GLCapability mediante la creacion de un objeto nuevo de la claseGLCapability.

NOTA: GLCanvas desciende de la clase java.awt.Canvas y GLJPanel de-sciende de la clase javax.swing.JPanel y por lo tanto heredan sus metodos.Al presente solo la clase GLCanvas se beneficia de tarjetas de video con acel-eradores graficos, de manera que aunque la librerıa SWING sea mas popular,el utilizarla podrıa resultar en un desempeno reducido.

GLCanvas canvas = GLDrawableFactory.getFactory().createGLCanvas(new

GLCapabilities());

frame.add(canvas);

Ahora que el Frame tiene un GLCanvas, establecemos algunos parametrosadicionales para el frame incluyendo el tamano de la ventana, el color delfondo y que hacer cuando el usuario decide cerrar la ventana.

frame.setSize(300, 300);

frame.setBackground(Color.WHITE);

frame.addWindowListener(new WindowAdapter()

public void windowClosing(WindowEvent e)

System.exit(0);

);

Finalmente, hay que indicarle al frame que se muestre y comience a acep-tar las entradas del usuario:

frame.show();

El metodo reshape de la interfaz GLEventListener se llama cuando laventana cambia de tamano y se considera el lugar apropiado para establecer


el puerto de vision y la perspectiva, en el ejemplo se establece una perspectivacon un angulo de vision de 45 grados, y un valor de cercanıa y lejanıa de 1 y20 respectivamente

public void reshape(GLDrawable gLDrawable, int x, int y,

int width, int height)

final GL gl = gLDrawable.getGL();

final GLU glu = gLDrawable.getGLU();

if (height <= 0) // avoid a divide by zero error!

height = 1;

final float h = (float)width / (float)height;

gl.glViewport(0, 0, width, height);

//Selecciona la Matriz de Proyeccion

gl.glMatrixMode(GL.GL_PROJECTION);

// Y borrala (Hazla la matriz identidad)

gl.glLoadIdentity();

glu.gluPerspective(45.0f, h, 1.0, 20.0);

//Selecciona la Matriz de Modelado

gl.glMatrixMode(GL.GL_MODELVIEW);

// Y borrala (Hazla la matriz identidad)


El metodo init de GLEventListener es llamado inmediatamente despuesde que se crea el contexto de OpenGL, usualmente, aquı se ejecutan accionesque requieren hacerse una sola vez al inicio como por ejemplo ubicacion deluces, en nuestro caso solo habilitamos el sombreado suave (GL SMOOTH),establecemos el color negro como fondo y agregamos el KeyListener para quedetecte cuando se pulsan teclas

public void init(GLDrawable gLDrawable)


gl.glShadeModel(GL.GL_SMOOTH);

// El cuarto parametro (alfa) es la transparencia y se usa en iluminacion

gl.glClearColor(1.0f, 1.0f, 1.0f, 0.5f);

2.7. DESPLIEGE DE LINEAS, TRIANGULOS, CUADRADOS, CIRCUNFERENCIAS, ETC MEDIANTE OPENGL39

gLDrawable.addKeyListener(this);

El metodo display de GLEVentListener es el lugar indicado para ponerel codigo relativo a los objetos que queremos mostrar en la ventana, en estecaso solo limpiamos la pantalla

public void display(GLDrawable gLDrawable)


// Limpia la pantalla y el buffer de profundidad

gl.glClear(GL.GL_COLOR_BUFFER_BIT | GL.GL_DEPTH_BUFFER_BIT);

// Borra la Matriz de Modelado (ModelView)


2.7. Despliege de lineas, triangulos, cuadra-

dos, circunferencias, etc mediante OpenGL

El siguiente codigo despliega 3 puntos en 2D

gl.glBegin (GL.GL_POINTS);

gl.glVertex2i (100,50);



gl.glEnd ();

El siguiente codigo despliega dos lıneas paralelas en 2D

gl.glBegin (GL.GL_LINES);

gl.glVertex2i (50, 200);




gl.glEnd();

El siguiente codigo despliega una polilınea abierta


gl.glBegin (GL.GL_LINE_STRIP);





gl.glEnd();

El siguiente codigo despliega una polilınea cerrada

gl.glBegin (GL.GL_LINE_LOOP);





gl.glEnd();

El siguiente codigo despliega dos trianngulos

gl.glBegin (GL.GL_TRIANGLES);







gl.glEnd();

gl.glRecti (200, 50, 250, 150);

El siguiente codigo despliega una polıgono, a diferencia de una polilıneacerrada, este tiene un color de relleno (por defecto)

gl.glBegin (GL.GL_POLYGON);






gl.glEnd();

Capıtulo 3

Algoritmos de Relleno de areas

Para rellenar un area, por ejemplo de un polıgono, podrıamos simplementeverificar para cada uno de los pixels si esta dentro o fuera del area a rellenar,esta estrategia es demasiado costosa, podrıamos sin embargo ahorrar muchoscalculos si restringimos los pixels de manera que se revisen solo aquellos pixelsque esten dentro del rectangulo de menor tamano que confine al polıgono encuestion, esta estrategia funciona mejor con unos polıgonos que con otros, esdecir, el ahorro depende de la forma del polıgono.

3.1. Relleno mediante ordenamiento de aris-

tas

Se puede aprovechar la propiedad conocida como “coherencia espacial”que nos dice que los pixels que estan juntos muy probablemente tendran lasmismas caracterısticas (ej. color), en particular, los pixels que pertenecen ala misma linea de rastreo tendran “coherencia de linea de rastreo”. Considerepor ejemplo el polıgono de la Figura 3.1, la lınea de rastreo B es divididaen regiones por las intersecciones con las lıneas que conforman el polıgono,el primer segmento de la lınea de rastreo queda fuera del polıgono, mientrasque el segmento que va de 4 a 5 esta formado por pixels que deben ponerseen el color de relleno ya que quedan dentro del polıgono, el segmento de 5 a 6debe quedar en el color del fondo puesto que son pixels que quedan fuera delpolıgono, el segmento de 6 a 7 queda dentro y el resto del segmento (de 7 enadelante) queda fuera. Hay que tener en cuenta que los vertices son puntosque al intersectar a la correspondiente lınea de rastreo pueden o no marcar

41

42 CAPITULO 3. ALGORITMOS DE RELLENO DE AREAS

Figura 3.1: Polıgono de ejemplo para rellenar por linea de rastreo

el inicio o fin de un segmento de pixels que pertenecen al area de relleno,por ejemplo, en la lınea de rastreo A, el punto 3 no marca el inicio de unsegmento de relleno; en la lınea de rastreo C, el punto 9 tampoco marca elfinal del segmento de la lınea que esta dentro del area de relleno, en cambio,el la lınea de rastreo D, el punto 12 (que tambien es un vertice) sı marcaal final de un segmento de la lınea que queda dentro del area de relleno. Eneste proceso, las lıneas horizontales deben ser ignoradas. Tomando en cuentaestas observaciones, el algoritmo de relleno por ordenamiento de aristas qrecibe la lista de vertices P1, P2,...,Pn que definen el polıgono a rellenar ydefine cuales pixels deben ponerse al color del relleno:

1. i = 1

2. Mientras i < n

Si la linea que va del vertice Pi al vertice Pi+1 no es horizontal,

3.2. RELLENO MEDIANTE COMPLEMENTACION 43

entonces utilizando el algoritmo de Bresenham determina los pixels(x, y) que conforman la lınea que va del vertice Pi al vertice Pi+1

3. Si la lınea que va del vertice Pn al vertice P1 no es horizontal entoncesutilizando el algoritmo de Bresenham determina los pixels (x, y) queconforman la lınea que va del vertice Pn al vertice P1

4. Ordenar la coleccion completa de pixels primero por y (lınea de rastreo)y luego por x

5. Como resultado del ordenamiento anterior se detectan duplicados, es-tos corresponden con vertices. Conservar estos duplicados si el verticecorresponde con un maximo o con un mınimo, eliminar uno de los dosduplicados en caso contrario.

6. Por cada lınea de rastreo de la lista ordenada

j = 1

Mientras hay mas elementos en la lista ordenada de la actual lıneade rastreo, tomar dos elementos de la lista xj y xj+1 y poner los pixelsen la actual lınea de rastreo que van de xj a xj+1 en el color de relleno

j = j + 2

El paso 4 del algoritmo de relleno por ordenamiento de aristas es el mascostoso, es precisamente en donde se ordenan todos los pixels que formanel contorno del polıgono. Podemos ahorrarnos el paso 4 si al ir generandolos pixels por donde pasan las lıneas que van de cada vertice al siguiente seinsertan en una lista ordenada en lugar de posponer el ordenamiento paracuando esta lista este completa.

3.2. Relleno mediante complementacion

Este algoritmo hace uso del hecho de que al realizar la operacion XORentre un valor y el valor actual de un pixel, se obtienen los efectos descritosen la Tabla 3.1, observe en esta tabla que encender un pixel que ya esta en-cendido es equivalente a apagarlo. Este hecho es claro cuando trabajamos condibujos en blanco y negro, es decir, sabemos que dibujar una linea encima deotra identica a la que se esta trazando utilizando la operacion XOR es equiv-alente a borrarla. Un comportamiento similar ocurre cuando se trabaja con


lıneas de cualquier color y el color del fondo, es decir, si se dibuja una lıneaazul sobre un fondo rojo utilizando la operacion XOR la lınea que se obtienees en realidad verde, pero al volver a dibujar la lınea azul sobre dicha lıneaverde recien trazada (de nuevo con la operacion xor) se obtiene una lınearoja igual que el fondo, por lo tanto la lınea ya no se ve, ¡se ha borrado!. Porlo tanto el efecto de que dibujar dos veces una misma lınea con la operacionxor es equivalente a no dibujar nada es valido para dibujos a color y no soloen blanco y negro.

Tabla 3.1: Operacion XOR

valor pixel resultado0 0 00 1 11 0 11 1 0

A diferencia del algoritmo de relleno por ordenamiento de aristas, el al-goritmo de relleno mediante complementacion no necesita realizar ningunordenamiento ni mantener ninguna lista ordenada, el algoritmo consiste en:

1. Por cada arista no horizontal del polıgono

descubrir las coordenadas (x, y) por las que pasa la arista medianteel algoritmo de Bresenham

Por cada x

Realizar la operacion XOR entre el color de relleno y el colorexistente en el dibujo desde (x, y) hacia la derecha hasta (x, ymax) dondeymax es el numero de columnas (pixels horizontales) de la ventana dedibujo

En las figuras 3.2 y 3.3 se muestra un ejemplo donde se relleno un polıgonotomando las aristas en el orden d,b,e,c,a. Las aristas horizontales no partici-pan en el proceso (arista f en el ejemplo). El orden en que se tomen las aristases irrelevante, el algoritmo de relleno de polıgonos mediante complementacionfunciona, se deja al lector como ejercicio probar otro orden de aristas


Figura 3.2: Relleno mediante complementacion


Figura 3.3: Relleno mediante complementacion (continuacion)


Figura 3.4: Relleno mediante complementacion usando una cerca

3.2.1. Modificacion mediante el uso de una cerca

El algoritmo de relleno mediante complementacion no requiere dedicartiempo para ordenar o mantener ordenada ninguna lista de pixels que con-forman aristas, pero en cambio dedica demasiado tiempo a cambiar el colorde demasiados pixels, algunos de ellos varias veces, este tiempo se puedereducir drasticamente si se emplea una cerca, la cerca es una lınea verticalinfinita imaginaria que pasa por cualquier vertice del polıgono, entonces, enlugar de modificar los pixels a la derecha cada arista se modifican los pix-els que estan entre la arista y la cerca solamente, en la Figura 3.4 y 3.5 semuestra un ejemplo de este procedimiento utilizando la misma secuencia dearistas (d,b,c,a).


Figura 3.5: Relleno mediante complementacion usando una cer-ca(continuacion)

3.3. ALGORITMO SIMPLE DE SIEMBRA DE SEMILLA 49

3.3. Algoritmo simple de siembra de semilla

Este algoritmo recibe un pixel inicial interior al area que se quiere rellenar,llamamos a este pixel semilla, el algoritmo pone este pixel en el color delrelleno y enseguida verifica los pixels que estan alrededor de este, para cadapixel circundante aquellos que no esten en el color del relleno o en el colordel borde los convierte en semillas nuevas. Para cada semilla nueva se repiteel proceso. Este algoritmo se puede implementar en forma iterativa haciendouso de una pila o bien en forma recursiva. El Algoritmo 9 muestra la versioniterativa, la version recursiva se muestra a continuacion:

rellena(int x,int y)

setPixel(x,y,colorRelleno);

color=getPixel(x+1,y);

if ((color!=colorRelleno)&&(color!=colorBorde)) rellena(x+1,y);

color=getPixel(x-1,y);

if ((color!=colorRelleno)&&(color!=colorBorde)) rellena(x-1,y);

color=getPixel(x,y+1);

if ((color!=colorRelleno)&&(color!=colorBorde)) rellena(x,y+1);

color=getPixel(x,y-1);

if ((color!=colorRelleno)&&(color!=colorBorde)) rellena(x,y-1);


Input: coordenadas de la semilla x,y, colorRelleno, colorBordeOutput: Figura rellenapush(x,y)while pop(x,y) do

setPixel(x,y,colorRelleno)if color(x− 1, y) 6∈ colorRelleno, colorBorde then

push(x-1,y)endif color(x + 1, y) 6∈ colorRelleno, colorBorde then

push(x+1,y)endif color(x, y − 1) 6∈ colorRelleno, colorBorde then

push(x,y-1)endif color(x, y + 1) 6∈ colorRelleno, colorBorde then

push(x,y+1)end

endAlgorithm 9: Algoritmo de semilla para rellenar areas

Tanto el algoritmo 9 como su version recursiva mostrada antes utilizanconectividad 4, es decir, cada pixel se considera conectado unicamente a los4 pixels que estan al Norte, Sur, Este y Oeste del mismo, es facil modificarlospara que tengan conectividad 8, es decir que se considere tambien a los pixelsque estan al Sureste, Noreste, Noroeste y Suroeste, esta decision debe sercongruente con la forma de dibujar las figuras.

3.3. ALGORITMO SIMPLE DE SIEMBRA DE SEMILLA 51

Input: coordenadas de la semilla x,y, colorRelleno, colorBordeOutput: Figura rellenapush(x,y)while pop(x,y) do

colorearArriba=false; colorearAbajo=false; xSalva=x;while color(x, y) 6= colorBorde do

setPixel(x,y,colorRelleno)if not colorearArriba then

if color(x, y − 1) 6∈ colorRelleno, colorBorde thenpush(x,y-1); colorearArriba=true;

end

endif not colorearAbajo then

if color(x, y + 1) 6∈ colorRelleno, colorBorde thenpush(x,y+1); colorearAbajo=true;

end

endx=x+1;

endx=xSalva-1;while color(x, y) 6= colorBorde do

setPixel(x,y,colorRelleno)if not colorearArriba then

if color(x, y − 1) 6∈ colorRelleno, colorBorde thenpush(x,y-1); colorearArriba=true;

end

endif not colorearAbajo then

if color(x, y + 1) 6∈ colorRelleno, colorBorde thenpush(x,y+1); colorearAbajo=true;

end

endx=x-1;

end

endAlgorithm 10: Algoritmo de semilla por lınea de rastreo


3.4. Siembra de semilla por lınea de rastreo

Al aplicar el algoritmo de semilla tal y como se explico en la seccion ante-rior para rellenar un area grande, muy probablemente se tendran problemasde memoria, esto es debido a que al sacar un elemento de la pila, se puedenintroducir cuatro (u ocho si se opto por esa conectividad). El algoritmo desiembra de semilla por lınea de rastreo soluciona este problema, al insertarun maximo de 2 elementos a la pila por cada lınea de pixels que pone en elcolor de relleno, el algoritmo saca la semilla de la pila y rellena la lınea derastreo a la que corresponde la semilla hacia la derecha y hacia la izquierda yal hacerlo checa los pixels que estan en la lınea de rastreo inmediata superiore inmediata inferior, si encuentra al menos un pixel de la lınea inmediatasuperior que no este en el color del relleno mete ese pixel a la pila pero solouno de toda la lınea, hace lo mismo con la lınea inmediata inferior. El metodose muestra con detalle en el Algoritmo 10

3.5. Funciones de OpenGL para manejo del

color de las figuras y del fondo

Al ejecutar la funcion:

void glColor3f( GLfloat red, GLfloat green, GLfloat blue )

especificamos el color que OpenGL utilizara al trazar cualquier cosa en ahı enadelante. Los tres parametros que recibe deberan tener un valor entre 0.0 y1.0 y define el porcentaje de rojo, de verde y de azul respectivamente. Siademas deseamos especificar el parametro alfa, utilizamos la funcion:

void glColor4f( GLfloat red, GLfloat green, GLfloat blue, GLfloat alpha)

El valor alfa se utiliza para mezclar colores usando su valor como porcentajede dicho color. Utilizando mezclado de colores se pueden lograr ciertos efec-tos como dibujar figuras semitransparentes.

La funcion:

3.5. FUNCIONES DE OPENGL PARA MANEJO DEL COLOR DE LAS FIGURAS Y DEL FONDO53

void glClearColor3f( GLfloat red, GLfloat green, GLfloat blue )

Nos permite especificar el color del fondo

Capıtulo 4

Algoritmos de Recorte

En muchas aplicaciones se debe seleccionar una area de recorte que definelo que sera visible por ejemplo para hacer un acercamiento a una seccion deinteres

4.1. Codigos de region para determinar la vi-

sibilidad de lıneas

Una manera rapida para decidir cuales lıneas son totalmente visibles,parcialmente visibles o trivialmente invisibles es utilizar los codigos de Cohen,este metodo funciona para areas de recorte rectangulares. La Figura 4.1 definelos codigos de Cohen, el primer bit (el menos significativo) indica que elvertice esta a la izquierda del area de recorte, el segundo bit indica que elpunto este se encuentra a la derecha, el tercero y cuarto bit indican que elpunto esta por arriba y por debajo del area de recorte respectivamente.

Una lınea es totalmente visible si los codigos de Cohen de ambos extremosson 0000. Si al hacer la operacion AND entre los codigos de Cohen de losextremos de una lınea se obtiene un resultado distinto de 0000, entoncesla lınea es trivialmente invisible puesto que ambos extremos se encuentrana la izquierda o ambos estan arriba, etc. Ahora bien, si la operacion ANDentre los dos extremos de una lınea resulta en 0000, esto no significa que lalınea sea totalmente visible sino que puede ser parcialmente visible o inclusototalmente invisible. Por supuesto, si uno de los extremos tiene un Codigode Cohen de 0000 y el otro extremo tiene un codigo diferente, entonces lalınea es parcialmente visible. En la Figura 4.2 se muestra un conjunto de

55

56 CAPITULO 4. ALGORITMOS DE RECORTE

Figura 4.1: Codigos de Cohen para determinar visibilidad

lıneas que en base al area de recorte. La Tabla 4.1 muestra los codigos deCohen correspondientes a las lıneas de la Figura 4.2. Observe que el metodono puede resolver el caso de las lıneas ab ni il.

Tabla 4.1: Codigos de Cohen de las lıneas de la Figura 4.2

lınea Codigo 1 Codigo 2 AND Observacion

ab 0001 1000 0000 Parcialmente visiblecd 0000 0000 0000 Totalmente visibleef 0100 0000 0000 Parcialmente visiblegh 0010 0010 0010 Trivialmente invisibleil 1000 0010 0000 Totalmente invisible

4.2. Algoritmo de recorte explıcito en 2D

Para lıneas que no son “trivialmente invisibles” o totalmente visibles, esnecesario encontrar su interseccion con las lıneas que conforman el area rect-

4.2. ALGORITMO DE RECORTE EXPLICITO EN 2D 57

Figura 4.2: Lıneas a recortar y area de recorte

angular de recorte, las cuales son:

y = ysup extremo superiory = yinf extremo inferiorx = xizq extremo izquierdax = xder extremo derecho

La ecuacion de una lınea recta que pasa por los puntos (x1, y1) y (x2, y2)es:

y = mx + b (4.1)

donde m = y2−y1

x2−x1

Como la lınea pasa por (x1, y1), entonces:

y1 = mx1 + b (4.2)

Por lo que:

b = y1 −mx1 (4.3)


Por tanto:

y = mx + y1 −mx1 (4.4)

Agrupando:

y = m(x− x1) + y1 (4.5)

De manera similar, despejando x de (4.1)

x =y

m− b

m(4.6)

Sustituyendo (4.3) en la ecuacion anterior obtenemos:

x =y

m− y1 −mx1

m(4.7)

De donde:

x =y − y1

m+ x1 (4.8)

Por lo tanto, Utilizando (4.5) obtenemos la interseccion de la recta concon el extremo derecho ocurre en:

(xder,y2 − y1

x2 − x1

(xder − x1) + y1) (4.9)

La interseccion con el extremo izquierdo ocurre en:

(xizq,y2 − y1

x2 − x1

(xizq − x1) + y1) (4.10)

Utilizando (4.8) obtenemos la interseccion de la recta con con el extremosuperior ocurre en:

((ysup − y1)x2 − x1

y2 − y1

+ x1, ysup) (4.11)

La interseccion con el extremo inferior ocurre en:

((yinf − y1)x2 − x1

y2 − y1

+ x1, yinf ) (4.12)

Por supuesto, hay que descartar intersecciones que no ocurran en la rectasino en alguna prolongacion de la recta

4.2. ALGORITMO DE RECORTE EXPLICITO EN 2D 59

Figura 4.3: Recorte Explıcito

4.2.1. Ejemplo

Recorte la lınea que va de (-3/2,1/6) a (1/2,3/2) de acuerdo al area derecorte de la Figura 4.3

La interseccion con el extremo derecho ocurre en:

(1,

3/2− 1/6

1/2− (−3/2)(1− (−3/2)) + 1/6

)=

(1,

(2

3

)(5

2

)+

1

6

)=

(1,

11

6

)

la cual se descarta porque ocurre mas a la derecha del extremo derechode la lınea (11/6 > 1). La interseccion con el extremo izquierdo ocurre en:

(− 1,

3/2− 1/6

1/2− (−3/2)(−1− (−3/2))+1/6

)=

(− 1,

(2

3

)(1

2

)+

1

6

)=

(− 1,

1

2

)

La interseccion con el extremo superior ocurre en:

((1− 1/6)

1/2− (−3/2)

3/2− 1/6+ (−3/2), 1

)=

((5

6

)(3

2

)− 3

2, 1

)=

(− 1

4, 1

)


Finalmente, la interseccion con el extremo inferior ocurre en:

((−1−1/6)

1/2− (−3/2)

3/2− 1/6+(−3/2),−1

)=

((−7

6

)(3

2

)−3

2,−1

)=

(−13

4,−1

)

El cual tambien se descarta porque ocurre mas a la izquierda del principiode la lınea (−13/4 < −3/2). Los puntos de interseccion no descartados nosindican que la lınea recortada va de (-1,1/2) a (-1/4,1).

4.3. Algoritmo de Sutherland-Cohen

Por cada extremo de la ventana rectangular de recorte efectuar lospasos (a), (b) y (c)

- (a) Para la lınea P1P2, determine si la lınea es totalmente visibleo si puede ser descartada como trivialmente invisible

- (b) Si P1 esta fuera de la ventana de recorte continua, de lo con-trario intercambia P1 y P2

- (c) Reemplaza P1 por la interseccion de P1P2 con el extremo enturno

4.4. Algoritmo de la subdivision del punto

medio

Encontrar la interseccion de una lınea con un area de recorte rectangu-lar puede hacerse por bisecciones, es decir, dividiendo la lınea a la mitad yanalizando ambas partes, una de ellas se descarta ya sea por ser trivialmenteinvisible o por ser completamente visible. La busqueda de la interseccion con-tinua en la otra mitad de la lınea. Este metodo tiene la enorme ventaja depoderse implementar muy facilmente en hardware e incluso en caso de im-plementarse en software tiene la ventaja de usar solo aritmetica entera dadoque la operacion de dividir entre dos es en realidad un corrimiento hacia laderecha. El Algoritmo 11 es una version recursiva de este metodo

4.5. ALGORITMO DE CYRUS-BECK PARA RECORTE DE REGIONES CONVEXAS61

Recorta(P1,P2)if P1P2 es una lınea trivialmente invisible then

Descarta el segmento de lınea (P1,P2);Termina;

endif P1P2 es una lınea totalmente visible then

Incluye como visible el segmento de lınea (P1,P2);Termina;

endPm = (P1 + P2)/2Recorta(P1Pm);Recorta(PmP2);

Algorithm 11: Algoritmo de subdivision del punto medio

4.5. Algoritmo de Cyrus-Beck para recorte

de regiones convexas

El Algoritmo de Cyrus-Beck hace uso del hecho de que un punto aesta dentro de un area de recorte convexa respecto a cierta lınea que de-fine un borde si se cumple la desigualdad:

n · (b− a) > 0 (4.13)

donde n es un vector normal a la lınea que define el borde y b es cualquierpunto en ese borde

Por supuesto, a y b son a la vez puntos y vectores que van del origen ala ubicacion de los mismos. En realidad la Ecuacion (4.13) nos dice que si aesta dentro del area de recorte, entonces el vector que va de b hacia a ( esdecir, el vector b − a) tiene un angulo interno menor de 90 grados respectoal vector normal n. Por otro lado, el punto a se encuentra fuera del area derecorte si se cumple:

n · (b− a) < 0 (4.14)

Finalmente, el punto a se encuentra justo en el borde si se cumple:

n · (b− a) = 0 (4.15)


El Algoritmo de Cyrus-Beck hace uso de la ecuacion parametrica de unalınea recta que va de P1 a P2 que es:

P (t) = P1 + (P2 − P1)t (4.16)

donde t es el parametro que vale 0 al principio de la lınea (En P1) y 1 alfinal de la misma (En P2)

Aplicando (4.15) podemos obtener el valor de t para el cual la lınea coin-cide con la frontera del area de recorte despejandolo de:

n · (P (t)− f) = 0 (4.17)

donde f es cualquier punto de la frontera en cuestionLo que la ecuacion (4.17) nos dice es que un vector que corre a lo largo

de la frontera (P (t)− f) tiene exactamente 90 grados respecto a la normal ala lınea que define dicha frontera (n). Despejando t de (4.17) y luego susti-tuyendola en P (t) obtenemos las coordenadas donde la lınea es cortada por lafrontera en cuestion, el proceso se debe repetir para cada una de las fronteras(lıneas borde) que definen el area de recorte convexa.

Sustituyendo (4.16 en (4.17) obtenemos:

n · (P1 + (P2 − P1)t− f) = 0 (4.18)

Rearreglando;

n · (P1 − f) + n · (P2 − P1)t = 0 (4.19)

O bien:

n · w + (n ·D)t = 0 (4.20)

donde D = P2 − P1 es la directriz ya que define la direccion de la lıneaP (t) y w = P1 − f

Despejando t de (4.20):

t = −n · wn ·D (4.21)

Si n · D > 0, entonces el valor de t corresponde a un lugar cercano alinicio de la lınea, si por el contrario n ·D < 0, el valor de t corresponde a unlugar cercano al final de la lınea.


Figura 4.4: Recorte en un area convexa

Cuando una lınea se recorta en un area definida por un polıgono convexo,las intersecciones de la lınea en cuestion con las diferentes aristas del polıgonose pueden agrupar en dos conjuntos, a saber, las intersecciones que estan cercadel inicio de la lınea y las que estan cerca del final de la lınea, de cada grupose elige solo una, necesitamos a la interseccion mas alejada del principio dela lınea de entre aquellas clasificadas como cerca del inicio. Del otro extremo,debemos elegir a la interseccion mas alejada del final de la lınea del grupo deintersecciones consideradas como cercanas al final de esta.

4.5.1. Ejemplo

Recortar la lınea que va del punto (-1,1) al punto (3,3) de acuerdo al areade recorte mostrada en la Figura 4.4.

Solucion:

La directriz D es:

D = P2 − P1 =[ 3

3

]−

[ −11

]=

[ 42

](4.22)


Para la arista V5V6, la normal que apunta hacia adentro del area de recortees:

n =[ −1−1

](4.23)

Entonces:

n ·D =[ −1−1

]·[ 4

2

]= −6 ≤ 0 (4.24)

Lo cual significa que la interseccion de la lınea con la arista V5V6 esta cercadel final de la lınea.

tomando a f =[ 2

3

]como un punto que forma parte de la arista V5V6

determinamos w:

w = P1 − f =[ −1

1

]−

[ 23

]=

[ −3−2

](4.25)

De ahı que:

n · w =[ −1−1

]·[ −3−2

]= 5 (4.26)

Finalmente:

t = −n · wn ·D = − 5

−6=

5

6(4.27)

Lo cual significa que esta arista intersecta a la lınea en:

P (5

6) = P1 + (P2 − P1)

5

6=

[ −11

]+

([ 33

]−

[ −11

])5

6=

[ 7/38/3

](4.28)

El proceso se repite para cada una de las aristas, el resultado se resumeen la Tabla 4.2. En la columnas etiquetadas ti y tf se encuentran los valoresde t correspondientes a las intersecciones de la lınea P1P2 con cada arista,cuando el valor n · D es negativo el valor t se ubica en la columna tf pararecordar que es una interseccion cercana al final de la lınea, si en cambio n ·Des una cantidad positiva entonces el valor t se ubica en la columna ti dadoque se trata de una interseccion cercana al inicio de la lınea. Por supuesto,


los valores de t inferiores a cero o superiores a uno no corresponden a lugaresentre el principio y el final de lınea sino a prolongaciones de esta y puedenser descartados, de cualquier manera solo se elige realmente a un solo valorde la columna ti, aquel que es el mayor de todos, en nuestro ejemplo t = 1/4.De la misma manera, solo elegimos a un solo valor de la columna tf , es deciral menor de todos, en nuestro ejemplo t = 5/6.

Tabla 4.2: Recorte de la lınea P1P2 mostrada en la Figura 4.4 en el areaconvexa detallada en la misma figura

Arista n f w n · w n ·D ti tf

V1V2

[ 11

] [ 10

] [ −21

]-1 6 1

6

V2V3

[ 10

] [ 02

] [ −1−1

]-1 4 1

4

V3V4

[ 1−1

] [ 02

] [ −1−1

]0 2 0

V4V5

[ 0−1

] [ 23

] [ −3−2

]2 -2 1

V5V6

[ −1−1

] [ 23

] [ −3−2

]5 -6 5

6

V6V7

[ −10

] [ 31

] [ −40

]4 -4 1

V7V8

[ −11

] [ 31

] [ −40

]4 -2 2

V8V1

[ 01

] [ 10

] [ −21

]1 2 −1

2

Para terminar el ejemplo solo resta decir que la lınea recortada comienzaen t = 1/4 y termina en t = 5/6, lo cual corresponde a una nueva lınea queva de (0,3/2) a (7/3,8/3).

Capıtulo 5

Pipeline de visualizacionbidimensional

Un paquete grafico debe permitir a un usuario especificar cual parte deuna escena se quiere desplegar y en que lugar en el dispositivo de salida, estoimplica aplicar transformaciones de coordenadas mundiales a coordenadasde dispositivo que pueden incluir rotaciones, escalamientos y recortes de laspartes de la escena que hayan quedado fuera del area seleccionada para serdesplegada.

5.1. Coordenadas locales, coordenadas mundi-

ales, puerto de vision

Las figuras aisladas estan normalmente definidas en coordenadas de mod-elado (MC) las cuales son relativas a alguna parte de la misma figura, porejemplo el centro de la misma, ası los vertices de un cuadrado pudieran ser:(1,1),(1,-1),(-1,1),(-1,-1). Al establecer una escena, las diferentes figurasque la componen son convertidas a coordenadas mundiales (WC), entonceslos vertices o puntos de control tiene valores relativos a un lugar especıficode la escena misma.

Un area de la escena seleccionada para ser desplegada se denomina “ven-tana”. Un area del dispositivo de salida donde la ventana sera mapeada sedenomina “puerto de vision”. La ventana especifica lo que sera desplegadomientras que el puerto de vision especifica donde sera desplegado. El mapeode una parte de la escena en coordenadas mundiales a coordenadas de dis-

67

68 CAPITULO 5. PIPELINE DE VISUALIZACION BIDIMENSIONAL

Figura 5.1: Pipeline de visualizacion bidimensional

positivo implica normalmente mas de una transformacion. Opcionalmentepodemos convertir a coordenadas de vista (VC) como un metodo para es-tablecer orientaciones arbitrarias de la ventana, enseguida se pueden definircoordenadas normalizadas del puerto de vision (en el rango de cero a uno) ymapear las coordenadas de vista a coordenadas de vista normalizadas (NVC).En el paso final, todas las coordenadas contenidas en el puerto de vision sontraducidas a coordenadas de dispositivo (DC). La Figura 5.1 resume esteproceso.

Cambiando la posicion del puerto de vision podemos ver objetos en difer-entes lugares del dispositivo de salida, al cambiar el tamano del puerto devision podemos lograr efectos de magnificacion como viendo algo a traves deuna lupa. En cambio, si hacemos la ventana mas pequena tendremos efec-tos de acercamiento (zoom in) a alguna parte especıfica de la escena, porsupuesto, al hacer la ventana mas grande harıamos un alejamiento (zoomout). Se pueden lograr efectos de “paneo” moviendo la ventana por difer-entes lugares de la escena y manteniendo su tamano fijo.

Manejar coordenadas de vista normalizadas de cero a uno es de utilidadpara separar las transformaciones de vista y otras de las que son especıficasdel dispositivo,de esta manera el paquete de graficacion es independientedel dispositivo de salida, el resultado queda en un cuadrado unitario quesera facilmente mapeado a las coordenadas de cualquier dispositivo de salida.

Normalmente todas las transformaciones son preparadas para aplicarsevia una sola matriz de transformacion para ahorrar calculos, el recorte de laslıneas que quedan fuera del puerto de vision se hace entonces como ultimo

5.2. FUNCIONES DE OPENGL PARA VISUALIZACION BIDIMENSIONAL69

paso, esta es una de las mas importantes aplicaciones de los algoritmos derecorte.

5.2. Funciones de OpenGL para visualizacion

bidimensional

El metodo reshape de la interfaz GLEventListener se activa ante cualquiercambio del tamano de la ventana de despliegue (no confundir con la ventanaque toma una parte de la escena), tambien se activa la primera vez que selanza la aplicacion. El metodo reshape recibe el tamano de la ventana de de-spliegue en los parametros width y height, estos parametros son justamentelos que necesitamos para establecer el tamano del puerto de vision que esexactamente lo que hace la lınea:

gl.glViewport( 0, 0, width, height );

Cuando se pretende graficar solo en dos dimensiones se puede hacer usode una funcion de GLU (Graphics Library Utilities) denominada gluOrtho2Ddonde se define el rango de valores de coordenadas horizontales y verticalesque se pretende manejar, ası por ejemplo para indicar que en el eje horizontallos valores posibles para dibujar iran desde cero hasta 450 mientras que enel eje vertical estos podran variar desde cero hasta 375 usarıamos la lınea:

glu.gluOrtho2D( 0.0, 450.0, 0.0, 375.0);

Como en este caso no deseamos hacer ninguna operacion de proyeccion(proyectar figuras 3D en algun plano) se incluyen las lıneas:

gl.glMatrixMode( GL.GL_PROJECTION );


La funcion completa reshape de este ejemplo queda:

public void reshape (GLDrawable drawable,int x,int y,int width,int height)

GL gl = drawable.getGL();

GLU glu = drawable.getGLU();

gl.glViewport( 0, 0, width, height );

70 CAPITULO 5. PIPELINE DE VISUALIZACION BIDIMENSIONAL

gl.glMatrixMode( GL.GL_PROJECTION );


glu.gluOrtho2D( 0.0, 450.0, 0.0, 375.0);

Capıtulo 6

Transformaciones geometricas

Las transformaciones geometricas sirven para modificar la forma y ubi-cacion de los objetos, en la Figura 6.1 un punto es modificado en su posicion.

Sin embargo, una transformacion geometrica puede verse tambien comoaquella que nos lleva de un sistema de coordenadas a otro, en la Figura6.2 la misma transformacion de la Figura 6.1 se interpreta ahora como laque cambia un punto de un sistema de coordenadas x − y a un sistema decoordenadas u− v y vicebersa.

71

72 CAPITULO 6. TRANSFORMACIONES GEOMETRICAS

Figura 6.1: Primera interpretacion de una transformacion

Figura 6.2: Segunda interpretacion de una transformacion

6.1. TRANSFORMACIONES AFINES 73

6.1. Transformaciones afines

Una transformacion afın es aquella que se puede escribir de la forma:

x′ = axxx + axyy + bx (6.1)

y′ = ayxx + ayyy + by

donde axx, axy, bx, ayx, ayy y by son constantesUna transformacion afın es una operacion lineal, esto implica que si se

aplica la transformacion a todos los puntos que forman una lınea se obtieneotra lınea que tambien se puede obtener aplicando la transformacion soloa los extremos de la lınea y se generan los puntos intermedios mediantealgun algoritmo de trazado de lıneas como el de Bresenham, como corolariopodrıamos decir que si se transforma un punto que esta a la mitad de lalınea, este punto de ubicarıa justamente a la mitad de la lınea transformada.

Ejemplos de transformaciones afines son la traslacion, la rotacion, el es-calamiento, la reflexion y la inclinacion, cualquier composicion de estas op-eraciones tambien serıa una transformacion afın.

Si la transformacion afın solo hace uso de rotaciones, traslaciones y re-flexiones entonces las lıneas paralelas al transformarlas continuan siendo par-alelas, se conservan los angulos entre cualquier pareja de lıneas.

6.2. Transformaciones geometricas bidimen-

sionales basicas

6.2.1. Traslacion

Trasladamos un punto en la posicion (x,y) a la posicion (x’,y’) mediantela operacion:

x′ = x + tx (6.2)

y′ = y + ty

En forma vectorial

[ x′

y′]

=[ x

y

]+

[ txty

](6.3)


que en forma compacta puede representarse como:

p′ = p + t (6.4)

donde t es un vector de traslacion

6.2.2. Escalamiento

Escalamos mediante la operacion:

x′ = Sxx (6.5)

y′ = Syy

En forma matricial

[ x′

y′]

=[ Sx 0

0 Sy

][ xy

](6.6)

que en forma compacta puede representarse como:

p′ = Sp (6.7)

donde S es la matriz de escalamiento.

6.2.3. Rotacion

Para deducir la formula para rotar un punto alrededor del origen observe-mos la Figura 6.3, es claro que:

x′ = r cos(θ + φ) (6.8)

y′ = r sen(θ + φ)

recordando las identidades trigonometricas:

cos(α + β) = cos(α)cos(β)− sen(α)sen(β) (6.9)

sen(α + β) = cos(α)sen(β) + sen(α)cos(β)

podemos convertir (6.9) en:

6.3. COORDENADAS HOMOGENEAS 75

x′ = r cos(θ)cos(φ)− r sen(θ)sen(φ) (6.10)

y′ = r cos(θ)sen(φ) + r sen(θ)cos(φ)

De la Figura 6.3 podemos observar tambien que:

x = r cos(φ) (6.11)

y = r sen(φ)

Sustituyendo (6.12) en (6.11) obtenemos:

x′ = x cos(θ)− y sen(θ) (6.12)

y′ = y cos(θ) + x sen(θ)

que en forma matricial es:

[ x′

y′]

=[ cos(θ) −sen(θ)

sen(θ) cos(θ)

][ xy

](6.13)

y en forma compacta:

p′ = Rp (6.14)

donde R es la matriz de rotacion, la cual por cierto es ortogonal, lo quesignifica que su inversa es igual a su transpuesta, por lo tanto una rotacionen sentido inverso se puede obtener multiplicando por Rt o bien cambiandoθ por −θ. Es facil comprobar que R es ortogonal verificando que RtR = I,tambien porque el producto interno de las dos columnas o de los dos rengloneses igual a cero. R no solo es ortogonal sino que tambien es ortonormal yaque la norma de cualquier vector columna o renglon es igual a uno ya quecos2θ + sen2θ = 1.

6.3. Coordenadas Homogeneas

Hemos establecido que una traslacion es una suma vectorial (p′ = p + t),mientras que un escalamiento y una rotacion es un producto de una matriz


Figura 6.3: Rotacion de un punto alrededor del origen

por un vector (p′ = Sp y p′ = Rp respectivamente) podrıamos generalizar lastransformaciones de manera que siempre consistieran en un producto matri-cial y una suma vectorial (lo cual no serıa eficiente), es decir, la traslacionserıa p′ = Ip + t, la rotacion serıa p′ = Rp + 0 y el escalamiento serıap′ = Sp + 0, aun ası no habrıamos resuelto el problema de que las trans-formaciones no son faciles de componer. Las transformaciones compuestasson las que consisten de varias trasformaciones sucesivas, por ejemplo, unarotacion seguida de un escalamiento y luego una rotacion. Las coordenadashomogeneas solucionan el problema de las transformaciones sucesivas de unamanera eficiente al definir todas las transformaciones como un producto ma-tricial. Las coordenadas (x,y) se representan mediante una tercia ordenada(xh, yh, h) donde:

x =xh

h(6.15)

y =yh

h

Una coordenada especıfica (x,y) tiene un numero infinito de representa-ciones en coordenadas homogeneas (hx, hy, h), la alternativa mas simple

6.4. TRANSFORMACIONES COMPUESTAS 77

(h = 1) es tambien la mas usada, ası, excepto en algunas aplicaciones co-mo en la transformacion tridimensional a coordenadas de vista, las coor-denadas (x,y) las representamos simplemente como (x,y,1) en coordenadashomogeneas. Ahora podemos expresar la operacion de traslacion como en(6.16), la operacion de escalamiento como en (6.17) y la de rotacion comoen (6.18), es decir, todas de la misma manera, una multiplicacion matricialpor una matriz de 3 por 3 generica donde los elementos de la diagonal estanrelacionados con el escalamiento, los elementos de la tercer columna estanrelacionados con la traslacion y la rotacion afecta a la submatriz de 2 por 2superior izquierda.

[ x′

y′

1

]=

[ 1 0 tx0 1 ty0 0 1

][ xy1

](6.16)

[ x′

y′

1

]=

[ Sx 0 00 Sy 00 0 1

][ xy1

](6.17)

[ x′

y′

1

]=

[ cos(θ) −sen(θ) 0sen(θ) cos(θ) 0

0 0 1

][ xy1

](6.18)

6.4. Transformaciones compuestas

Ya hemos visto que las coordenadas homogeneas eficientizan la aplicacionde transformaciones sucesivas al permitir que todas las transformaciones con-sistan de multiplicaciones de matrices cuadradas, veamos ahora en accion estaidea con dos ejemplos, el escalamiento respecto a un punto fijo y la rotacionrespecto a un punto arbitrario

6.5. Escalamiento respecto a un punto fijo

El escalamiento simple lleva implıcito una traslacion posiblemente in-voluntaria como se puede observar en la Figura 6.4 donde a cada vertice deltriangulo de lıneas continuas se le ha aplicado un factor de escala Sx = Sy = 2para obtener el correspondiente vertice del triangulo escalado que se muestraen lıneas punteadas.


Figura 6.4: Escalamiento Simple

Es posible realizar el escalamiento respecto a un punto fijo (xf , yf ), paraello necesitamos realizar tres transformaciones, primero debemos realizar unatraslacion de manera tal que el punto designado como fijo coincida con elorigen, enseguida se hace el escalamiento simple. El punto que esta en elorigen naturalmente no resulta modificado en este paso. Finalmente se realizauna traslacion de forma que el punto fijo regrese a su lugar. El escalamientorespecto a un punto fijo se logra entonces mediante (6.19):

[ x′

y′

1

]=

[ 1 0 xf

0 1 yf

0 0 1

][ Sx 0 00 Sy 00 0 1

][ 1 0 −xf

0 1 −yf

0 0 1

][ xy1

](6.19)

La ventaja de trabajar en coordenadas homogeneas se puede apreciarahora, podemos realizar el producto matricial para obtener (6.20) y luego6.21:

[ x′

y′

1

]=

[ 1 0 xf

0 1 yf

0 0 1

][ Sx 0 −Sxxf

0 Sy −Syyf

0 0 1

][ xy1

](6.20)

6.5. ESCALAMIENTO RESPECTO A UN PUNTO FIJO 79

Figura 6.5: Rotacion respecto al origen

[ x′

y′

1

]=

[ Sx 0 xf (1− Sx)0 Sy yf (1− Sy)0 0 1

][ xy1

](6.21)

Por lo tanto la matriz de transformacion para realizar el escalamientorespecto a un punto fijo es:

[ Sx 0 xf (1− Sx)0 Sy yf (1− Sy)0 0 1

](6.22)

6.5.1. Rotacion respecto a un punto arbitrario

Cuando se realiza una rotacion respecto al origen existe tambien unatraslacion implıcita como se aprecia en la Figura 6.5

Es posible realizar una rotacion respecto a un punto (xr, yr) seleccionadocomo eje de rotacion como en la Figura 6.6, para ello, debemos componer trestransformaciones, la primera es una traslacion tal que el punto elegido comoeje de rotacion coincida con el origen como en la Figura 6.7, la segunda es larotacion respecto al origen como en la Figura 6.8, obviamente el punto que


Figura 6.6: Rotacion respecto a un eje de rotacion (xr, yr)

esta en el origen no sera afectado en esta etapa. La ultima transformaciones una traslacion que devuelva al punto (xr, yr) al lugar donde se encontrabaoriginalmente como en la Figura 6.9.

La rotacion respecto a un eje de rotacion se logra entonces mediante (6.23)

[ x′

y′

1

]=

[ 1 0 xr

0 1 yr

0 0 1

][ cosθ −senθ 0senθ cosθ 0

0 0 1

][ 1 0 −xr

0 1 −yr

0 0 1

][ xy1

](6.23)

Realizando el producto matricial obtenemos (6.24) y luego 6.25:

[ x′

y′

1

]=

[ 1 0 xr

0 1 yr

0 0 1

][ cosθ −senθ yrsenθ − xrcosθsenθ cosθ −xrsenθ − yrcosθ

0 0 1

][ xy1

](6.24)

[ x′

y′

1

]=

[ cosθ −senθ xr(1− cosθ) + yrsenθsenθ cosθ yr(1− cosθ)− xrsenθ

0 0 1

][ xy1

](6.25)

Por lo tanto la matriz de transformacion para realizar la rotacion respectoa un eje arbitrario es:

6.5. ESCALAMIENTO RESPECTO A UN PUNTO FIJO 81

Figura 6.7: Traslacion de forma que el eje de rotacion coincida con el origen

Figura 6.8: Rotacion respecto al origen


Figura 6.9: Traslacion de manera que el eje de rotacion regrese a su ubicacionoriginal

[ cosθ −senθ xr(1− cosθ) + yrsenθsenθ cosθ yr(1− cosθ)− xrsenθ

0 0 1

](6.26)

6.6. Reflexiones

Para reflejar una figura verticalmente utilizamos la transformacion (6.27),en la Figura 6.10 (a) se muestra un ejemplo, la reflexion horizontal se logramediante (6.28), en la Figura 6.10 (b) se muestra un ejemplo.

[ x′

y′

1

]=

[ 1 0 00 −1 00 0 1

][ xy1

](6.27)

[ x′

y′

1

]=

[ −1 0 00 1 00 0 1

][ xy1

](6.28)

Para reflejar una figura respecto al origen utilizamos la transformacion(6.29), en la Figura 6.11 se muestra un ejemplo. Para reflejar una figura

6.7. TRANSFORMACIONES GEOMETRICAS EN 3D SIMPLES 83

Figura 6.10: (a) Reflexion vertical, (b) Reflexion horizontal

respecto a la recta y = x utilizamos la transformacion (6.30), en la Figura6.12 se muestra un ejemplo.

[ x′

y′

1

]=

[ −1 0 00 −1 00 0 1

][ xy1

](6.29)

[ x′

y′

1

]=

[ 0 1 01 0 00 0 1

][ xy1

](6.30)

6.7. Transformaciones Geometricas en 3D Sim-

ples

Facilmente podemos generalizar las transformaciones geometricas paraque poderlas aplicar a figuras tridimensionales. En tres dimensiones las co-ordenadas homogeneas son representadas por vectores de 4 componentes ylas matrices de transformacion son de 4 por 4, a continuacion describiremoscomo realizar traslaciones, escalamientos y rotaciones tridimensionales:


Figura 6.11: Reflexion respecto al origen

Figura 6.12: Reflexion respecto a la recta y=x

6.7. TRANSFORMACIONES GEOMETRICAS EN 3D SIMPLES 85

6.7.1. Escalamiento

Para trasladar un punto p utilizamos la transformacion p′ = Sp, en formaexpandida es:

[ x′

y′

z′

1

]=

[ Sx 0 0 00 Sy 0 00 0 Sz 00 0 0 1

][ xyz1

](6.31)

6.7.2. Traslacion

Para trasladar un punto p utilizamos la transformacion p′ = Tp, en formaexpandida es:

x′

y′

z′

1

=

1 0 0 tx0 1 0 ty0 0 1 tz0 0 0 1

xyz1

(6.32)

6.7.3. Rotacion respecto al eje X

Para trasladar un punto p utilizamos la transformacion p′ = Rxp, enforma expandida es:

x′

y′

z′

1

=

1 0 0 00 cosθ −senθ 00 senθ cosθ 00 0 0 1

xyz1

(6.33)

6.7.4. Rotacion respecto al eje Y

Para trasladar un punto p utilizamos la transformacion p′ = Ryp, enforma expandida es:

x′

y′

z′

1

=

cosθ 0 −senθ 00 1 0 0

senθ 0 cosθ 00 0 0 1

xyz1

(6.34)


6.7.5. Rotacion respecto al eje Z

Para trasladar un punto p utilizamos la transformacion p′ = Rzp, enforma expandida es:

x′

y′

z′

1

=

cosθ −senθ 0 0senθ cosθ 0 0

0 0 1 00 0 0 1

xyz1

(6.35)

6.8. Rotacion respecto a un eje arbitrario

No siempre queremos rotar alrededor de uno de los tres ejes, necesitamosuna matriz de transformacion que nos permita realizar rotar un cierto anguloθ alrededor de un eje arbitrario, para determinar dicha matriz existen tresmetodos populares, a continuacion describiremos cada uno de ellos

6.8.1. Determinacion de la Matriz de transformacionpor Composicion de matrices

Para rotar un punto alrededor de un eje arbitrario un cierto angulo θdebemos realizar las siguientes transformaciones:

1. Trasladar el punto de manera que el eje de rotacion pase por el origen

2. Rotar el punto alrededor del eje x un angulo α tal que el eje de rotacionresida en el plano xz

3. Rotar el punto alrededor del eje y un angulo β tal que el eje de rotacioncoincida con el eje z

4. Rotar el punto alrededor del eje z un angulo θ

5. Rotar el punto alrededor del eje y un angulo −β

6. Rotar el punto alrededor del eje x un angulo −α

7. Trasladar el punto de manera que el eje de rotacion regrese a su lugaroriginal

6.8. ROTACION RESPECTO A UN EJE ARBITRARIO 87

En forma compacta, podemos expresar la rotacion de un punto un anguloθ alrededor de un eje arbitrario de la siguiente manera:

p′ = T−1R−1x (α)R−1

y (β)Rz(θ)Ry(β)Rx(α)Tp (6.36)

denotamos como T−1 a la transformacion inversa a la transformacion T ,es decir, si la matriz de transformacion T traslada un punto a una nuevaubicacion, entonces la transformacion inversa T−1 regresa a dicho punto a suubicacion original.

Si el eje de rotacion esta definido como una lınea que pasa por los puntosP1 = (x1, y1, x1) y P2 = (x2, y2, z2), entonces la matriz de traslacion que harıaque dicho eje pase por el origen puede ser:

T =

1 0 0 −x1

0 1 0 −y1

0 0 1 −z1

0 0 0 1

(6.37)

El eje de rotacion se puede definir como un vector unitario u = (a, b, c).Como dijimos, se requiere rotar u alrededor del eje x un angulo α de man-era que una vez rotado este coincida con el plano xz. Para determinar αproyectamos el vector u sobre el plano yz como en la Figura 6.13 obteniendoası el vector u′ = (0, b, c). Si a u′ lo rotamos un angulo α alrededor del eje xobtendrıamos el vector unitario uz = (0, 0, 1). El producto escalar entre u′ yuz nos permite obtener el valor de cos(α)

u′ · uz = |u′||uz|cos(α) = (0, b, c) · (0, 0, 1) = c (6.38)

donde |u′| = d =√

b2 + c2 y |uz| = 1entonces

cos(α) =c

d(6.39)

El producto vectorial entre u′ y uz nos permite obtener el valor de sen(α)

|u′ × uz| = |u′||uz|sen(α) = |(0, b, c)× (0, 0, 1)| = |(b, 0, 0)| = b (6.40)

donde |u′| = d =√

b2 + c2 y |uz| = 1entonces


Figura 6.13: proyeccion de u en el plano yz para determinar el angulo α

sen(α) =b

d(6.41)

Finalmente:

Rx(α) =

1 0 0 00 cos(α) −sen(α) 00 sen(α) cos(α) 00 0 0 1

=

1 0 0 00 c/d −b/d 00 b/d c/d 00 0 0 1

(6.42)

En la Figura 6.14 se muestra el vector u′′ que es el vector u una vez que seha rotado alrededor del eje x el angulo α requerido, por lo cual u′′ = (a, 0, d),esto es, la componente x no ha cambiado puesto que justamente la rotacionfue respecto al eje x, la componente en y es cero puesto que u′′ reside enel plano xz (es decir, el plano y=0) y la componente en z coincide con lamagnitud de la proyeccion de u sobre el plano yz (el plano x=0). El productoescalar entre u′′ y uz nos permite obtener el valor de cos(β)

u′′ · uz = |u′||uz|cos(β) = (a, 0, d) · (0, 0, 1) = d (6.43)

donde |u′′| = √a2 + d2 =

√a2 + b2 + c2 = 1

entonces


Figura 6.14: El vector u” gira un angulo βpara alinearse con el eje z

cos(β) = d (6.44)

El producto vectorial entre u′′ y uz nos permite obtener el valor de sen(β)

|u′′ × uz| = |u′′||uz|sen(β) = |(a, 0, d)× (0, 0, 1)| = |(0, 0,−a)| = a (6.45)

entonces

sen(β) = a (6.46)

Finalmente:

Ry(β) =

cos(β) 0 −sen(β) 00 1 0 0

sen(β) 0 cos(β) 00 0 0 1

=

d 0 −a 00 1 0 0a 0 d 00 0 0 1

(6.47)

La matriz que realiza la rotacion alrededor del eje z el angulo θ (especifi-cado por el usuario es por supuesto:


Rz(θ) =

cos(θ) −sen(θ) 0 0sen(θ) cos(θ) 0 0

0 0 1 00 0 0 1

(6.48)

Ahora se tienen todas la matrices especificadas en (6.36), solo habrıa querealizar dicho producto matricial

6.8.2. Determinacion de la Matriz de transformacionpor conjunto de vectores ortogonales

Cualquier transformacion geometrica es equivalente a un cambio de coor-denadas de referencia y la rotacion tridimensional respecto a un eje arbitrariono es la excepcion. Si cambiamos el sistema de coordenadas referencial demanera que el eje z del nuevo sistema de coordenadas coincida con el eje derotacion especificado por el usuario, entonces ya solo habrıa que hacer unarotacion alrededor del nuevo eje z. Para cambiar el sistema de coordenadasal nuevo sistema de coordenadas de referencia formado por los vectores uni-tarios u′x, u′y y u′z se debe utilizar una matriz de transformacion tal que lasubmatriz superior izquierda de 3x3 constituya una matriz ortogonal, estoimplica que los vectores u′x, u′y y u′z son todos ortogonales entre sı. La matrizde transformacion serıa entonces:

u′x,1 u′x,2 u′x,3 0u′y,1 u′y,2 u′y,3 0u′z,1 u′z,2 u′z,3 00 0 0 1

(6.49)

donde u′x = (u′x,1, u′x,2, u

′x,3), u′y = (u′y,1, u

′y,2, u

′y,3) y u′z = (u′z,1, u

′z,2, u

′z,3)

Ahora bien, de acuerdo al plan, hacemos u′z = u, es decir, el eje de rotacionindicado por el usuario, para u′y una opcion es realizar el producto cruz deu′z con ux (el vector unitario que apunta al actual eje x) y luego normalizarlopara su magnitud sea unitaria, ası:

u′y =u′z × ux

|u′z × ux| (6.50)


Finalmente, el tercer vector (u′x)es simplemente un vector ortogonal alplano formado por los dos vectores que ya tenemos, entonces:

u′x = u′z × u′y (6.51)

6.8.3. Determinacion de la Matriz de transformacionmediante Cuaterniones

Los cuaterniones son de utilidad en la geometrıa fractal y en la animacion,veremos ahora que tambien son utiles para realizar rotaciones alrededor de uneje arbitrario. Un cuaternion se puede ver de dos maneras, la primera de ellascomo un numero complejo que tiene una parte real y tres partes imaginarias,(q = s+ ia+jb+kc)cada una de ellas se reconoce por el operador imaginarioi,j o k, bajo esta definicion tenemos que:

i2 = j2 = k2 = −1 (6.52)

La segunda manera en que podemos visualizar un cuaternion es como unpar formado por un escalar s y un vector v, de esta manera:

ij = k

ik = −j

ji = −k

jk = i

ki = j

kj = −i

Sean los cuaterniones q1 = (s1, v1) y q2=(s2,v2), la suma de estos esta dadapor q1+q2 = (s1+s2, v1+v2), la diferencia esta dada por q1−q2 = (s1−s2, v1−v2) y el producto esta dado por: q1q2 = (s1s2 − v1 · v2, s1v2 + x2v1 + v1 × v2).

Un punto P en 3D podemos tratarlo como un cuaternion si establecemosque su parte escalar es simplemente cero. Para rotar dicho punto alrededorde un eje arbitrario definido por el vector u un cierto angulo θ realizamos elsiguiente producto de cuaterniones:

p′ = qpq−1 (6.53)


donde p′ = (0, P ′) y P ′ es el punto rotado, p = (0, P ) y P es el punto antesde ser rotado y q = (cos(θ/2), usen(θ/2). Como q es un cuaternion unitariose cumple que su inverso multiplicativo q−1 = (cos(θ/2),−usen(θ/2), es decirsimplemente la parte vectorial cambia de signo. θ es obviamente el anguloque se rota y u el vector alrededor del cual se rotara al punto P .

La operacion de rotacion utilizando cuaterniones en lugar de matrices esmuy eficiente puesto que se requieren menos operaciones aritmeticas parallevarla a cabo, tambien requiere menos almacenamiento pues un cuater-nion consta de 4 numeros en oposicion a los 9 que requiere una matriz derotacion 3D (y 16 cuando se usan coordenadas homogeneas), sin embargopara aprovechar la composicion de transformaciones es facil obtener la ma-triz de transformacion equivalente simplemente agrupando los terminos demanera adecuada.

6.9. Transformaciones geometricas con OpenGL

Opengl cuenta con tres funciones para llevar a cabo transformacionesgeometricas tridimensionales, para la traslacion usamos

glTranslatef(tx,ty,tz)

donde tx, ty y tz son los parametros de traslacion en x, y y z respectiva-mente. Para el escalamiento usamos:

glScalef(Sx,Sy,Sz)

donde Sx, Sy y Sz son los parametros de escalamiento en x, y y z respec-tivamente. Para la rotacion usamos:

glRotatef(teta,x,y,z)

donde teta es el angulo en grados que deseamos rotar alrededor de unvector especificado por x,y y z, por ejemplo para rotar 30 grados alrededordel eje y usarıamos:

glRotatef(30,0,1,0)

6.10. MANEJO DE PILAS DE MATRICES CON OPENGL 93

6.10. Manejo de pilas de matrices con OpenGL

Considere la funcion display siguiente:

void display(void)

glTranslatef(0.0, 0.0, .5);

glBegin(GL.GL_TRIANGLES);

glVertex3f( 0.0f, 1.0f, 0.0f);

glVertex3f(-1.0f,-1.0f, 0.0f);

glVertex3f( 1.0f,-1.0f, 0.0f);

glEnd();

Si obligamos a que se llame varias veces a la funcion display(), vemosque el triangulo se va moviendo progresivamente a lo largo de eje Z. Larazon de este movimiento es que en la funcion display esta incluida unallamada a glTranslatef(). Como se ha explicado anteriormente, las funcionesde traslacion multiplican la matriz actual por una matriz de traslacion creadacon los argumentos que se le pasan, por tanto, sucesivas llamadas a la funciondisplay() provocan sucesivas multiplicaciones de la matriz actual con el efectoque se observa de incrementar la traslacion. Para solucionar este problemaOpenGL dispone de unos stacks o pilas de matrices, que permiten almacenary recuperar una matriz anterior. Aunque OpenGL dispone de pilas paralas matrices GL-MODELVIEW y GL-PROJECTION, solo se suele utilizarla pila de GL-MODELVIEW. Una pila es un almacen con funcionamientoLIFO, el ultimo en entrar es el primero en salir, por lo que suele comparar auna pila de platos en la que solo se puede dejar uno encima de la pila o cogerel superior que es el ultimo depositado. La pila de matrices tiene el mismofuncionamiento sustituyendo los platos por matrices. La matriz superior de lapila es sobre la que se aplican las distintas transformaciones, multiplicandolapor la matriz que generan las distintas funciones.

Para poder guardar una determinada matriz y posteriormente recuperarlaOpenGL dispone de las dos funciones comentadas: glPushMatrix() y glPop-Matrix(). La funcion glPushMatrix() realiza una copia de la matriz superiory la pone encima de la pila, de tal forma que las dos matrices superioresson iguales. En la Figura 6.15 se observa la pila en la situacion inicial conuna sola matriz, al llamar a la funcion glPushMatrix() se duplica la matrizsuperior. Las siguientes transformaciones que se realizan se aplican solo a la


Figura 6.15: La pila de OpenGL

matriz superior de la pila, quedando la anterior con los valores que tenıa en elmomento de llamar a la funcion glPushMatrix(). La funcion glPopMatrix()elimina la matriz superior, quedando en la parte superior de la pila la matrizque estaba en el momento de llamar a la funcion glPushMatrix().

Modifiquemos la funcion display() de manera que al llamar a la funcionglPushMatrix() se realize una copia de la matriz actual. La traslacion enel eje Z se realiza en la matriz superior de la pila, es decir, en la copia dela matriz, de tal forma que al llamar a la funcion glPopMatrix(), como semuestra en la Figura 6.15, se elimina la matriz superior, que es la que tenıa elefecto de esta transformacion, quedando la matriz que estaba en el momentode llamar a glPushMatrix().

void display(void)

glPushMatrix();

glTranslatef(0.0, 0.0, .5);

glBegin(GL.GL_TRIANGLES);

glVertex3f( 0.0f, 1.0f, 0.0f);

glVertex3f(-1.0f,-1.0f, 0.0f);

glVertex3f( 1.0f,-1.0f, 0.0f);

glEnd();

glPopMatrix();

Capıtulo 7

Visualizacion 3D

Ya hemos hablado de transformaciones tridimensionales de objetos en3D pero la pantalla de la computadora (o el papel de la impresora) sonsuperficies, es decir son de solo dos dimensiones, por lo tanto necesitamos deuna forma de proyectar nuestros objetos tridimensionales en la pantalla

7.1. Proyeccion en paralelo

La proyeccion mas simple posible consiste en simplemente descartar lacoordenada z, este es un caso especial del metodos denominado “proyeccionparalela”. Una proyeccion paralela se forma extendiendo lıneas paralelas des-de cada vertice del objeto hasta que intersecten el plano de vision, los puntosde interseccion con el plano son los vertices proyectados y se conectan medi-ante lıneas de la misma manera que los vertices originales estan conectadosen el objeto tridimensional, ver Figura 7.1 [3].

El caso particular donde el plano de vision es el plano xy y la direccionde proyeccion es paralela al eje z corresponde con el simple descarte de lacoordenada z. En una proyeccion paralela general se puede elegir cualquierdireccion de proyeccion, digamos que la direccion de proyeccion esta definidapor el vector (xp, yp, zp) y que la imagen se proyecta sobre el plano xy. Sitenemos un punto en el objeto cuyas coordenadas son (x1, y1, z1) y quere-mos determinar el punto proyectado (x2, y2) entonces podemos escribir lasecuaciones parametricas de la lınea en la direccion de proyeccion:

95

96 CAPITULO 7. VISUALIZACION 3D

Figura 7.1: Proyeccion Paralela [3]

7.2. PROYECCION EN PERSPECTIVA 97

x = x1 + xpu

y = y1 + ypu

z = z1 + zpu (7.1)

Ahora, donde intersecta esta lınea con el plano xy?, eso es lo mismo quepreguntarse cuanto vale x y y cuando z=0, entonces:

u = −z1

zp

(7.2)

sustituyendo este valor en las otras dos ecuaciones tenemos:

x2 = x1 − z1xp/zp

y2 = y1 − z1yp/zp (7.3)

Lo cual en forma matricial en coordenadas homogeneas se expresa:

x2

y2

z2

1

=

1 0 −xp/zp 00 1 −yp/zp 00 0 0 00 0 0 1

x1

y1

z1

1

(7.4)

7.2. Proyeccion en perspectiva

En una proyeccion en perspectiva, mientras mas lejos se encuentra unobjeto del observador, mas pequeno parece ser, esto provee al observadorcon una indicacion de profundidad, es decir, que partes de un objeto seencuentran mas cercanas o mas lejanas. En la proyeccion en perspectiva laslıneas de proyeccion no son paralelas sino que convergen en un punto llamadocentro de proyeccion, estas serıan las trayectorias que seguirıan los rayos deluz proviniendo del objeto hacia el ojo del observador, es la interseccion deestas lıneas con el plano de vision que determinan la imagen proyectada,observe la Figura 7.2

La lınea que va del centro de proyeccion (xc, yc, zc) hacia el punto a proyec-tar (x1, y1, z1) tiene las siguientes ecuaciones parametricas:


Figura 7.2: Proyeccion en perspectiva [3]

7.3. PIPELINE DE VISUALIZACION TRIDIMENSIONAL 99

x = xc + (x1 − xc)u

y = yc + (y1 − yc)u

z = zc + (z1 − zc)u (7.5)

El punto proyectado (x2, y2) es aquel donde esta lınea intersecta el planode vision, si por ejemplo el plano de vision es el plano xy (el plano z=0)entonces:

u = − zc

z1 − zc

(7.6)

sustituyendo este valor en las otras dos ecuaciones tenemos:

x2 = xc − zcx1−xc

z1−zc

y2 = yc − zcy1−yc

z1−zc(7.7)

Lo cual en forma matricial en coordenadas homogeneas se expresa:

x2w2

y2w2

z2w2

w2

=

−zc 0 xc 00 −zc yc 00 0 0 00 0 1 −zc

x1w1

y1w1

z1w1

w1

(7.8)

7.3. Pipeline de visualizacion tridimensional

Un “pipeline de visualizacion 3D” es una especie de lınea de produccionque toma la descripcion de una escena tridimensional y la muestra en undispositivo de despliegue 2D

1. Sistema de coordenadas locales. Para facilitar el modelado, los verticesde un objeto estan referidas normalmente respecto a un punto situadodentro del mismo objeto, por ejemplo el centro del mismo. Definir unobjeto en coordenadas locales facilita su instanciacion.

2. Sistema de coordenadas mundiales. Todos los objetos de una escena sontransformados a un sistema de coordenadas comun, en este sistemase definen las fuentes de luz, la posicion y orientacion de la camaraası como los atributos de las superficies como colores y texturas.


3. Sistema de coordenadas de vision (espacio de la camara o de la vista).En este punto se establecen parametros de vision, ası, se establece un“volumen de vision” y se recorta todo lo que queda fuera de ese volumende vision, en este espacio se lleva a cabo la eliminacion de caras ocultasmediante el algoritmo de Robert (proceso conocido como “Culling”)

4. Sistema de coordenadas de pantalla 3D. En el espacio de vista, el vol-umen de vision tiene la forma de una piramide trunca, este espacio estransformado a otro con forma de caja con z como la profundidad de lacaja, en este espacio se lleva a cabo la eliminacion de superficies que noestan al frente (Se conoce a este proceso como HSR por Hidden SurfaceRemoval). Tambien se realiza en este espacio la iluminacion (decidir deque color queda cada cosa de acuerdo a la interaccion luminosa entrelos objetos de la escena)

5. Sistema de coordenadas de despliegue. Convertir la pantalla virtual acoordenadas reales de la pantalla

7.4. Volumen de vision

Para definir el volumen de vision debemos definir un plano de vision conun cierto ancho y una altura, ademas hay que establecer un plano de recortecercano y uno lejano. El plano de recorte cercano oculta las cosas que sesupone estan detras de la camara. El plano de recorte lejano oculta las cosasque quedan demasiado lejos para poderlas ver. En la Figura 7.3 se muestrael volumen de vision que es la parte del “Frustum” que contiene la escenavisible.

7.5. Funciones de visualizacion tridimension-

al de OpenGL

La funcion glFrustum [4] sirve para especificar el volumen de vision:

glFrustum(left, right, bottom, top, near, far)

Por ejemplo:

7.5. FUNCIONES DE VISUALIZACION TRIDIMENSIONAL DE OPENGL101

Figura 7.3: Volumen de vision

JGl.glMatrixMode(JGl.GL_PROJECTION);

JGl.glLoadIdentity();

JGl.glFrustum(-1, 1, -1, 1, 1.0, 20.0);

Alternativamente, podemos usar la funcion de GLU, gluPErspective paracrear un volumen de vision simetrico

gluPerspective(fovy, aspect, near, far)

donde fovy es el angulo del campo de vision en el plano yz el cual debeestar en el rango de 0 a 180 grados, aspect es la relacion ancho/alto delfrustum, se recomienda hacer que coincida con la relacion ancho/alto de laventana de despliegue, near y far deben ser valores positivos. Ejemplo:

JGlu.gluPerspective(60.0, 1.0, 1.0, 20.0);

Capıtulo 8

Supresion de Lıneas ySuperficies ocultas

Un problema importante en el proceso de desplegar imagenes que luzcanreales es el de diferenciar las partes visibles de aquellas que no se podrıan verdesde la posicion de algun observador. Existen varios metodos para lograresto, expondremos aquı algunos de los mas importantes.

8.1. Supresion de segmentos de lıneas ocultas

No solamente para mejorar el aspecto de una grafica o de un objeto sinopara eliminar la ambiguedad de una figura y por ende poderla entender, esnecesario eliminar las lıneas o los segmentos de lınea que no deberıan verse.Para ilustrar esto, veamos como al eliminar ciertas lıneas de un ambiguo cubode alambre mostrado en la Figura 8.1(a), obtenemos el cubo no ambiguo quese muestra en la Figura 8.1(b) y al eliminar otras lıneas obtenemos el cubono ambiguo mostrado en la Figura 8.1(c)

103

104CAPITULO 8. SUPRESION DE LINEAS Y SUPERFICIES OCULTAS

Figura 8.1: Al ocultar lıneas de un cubo de alambre se elimina la ambiguedadimplicita

8.1.1. Algoritmo del horizonte flotante

Este algoritmo se utiliza para desplegar funciones de dos variables y =f(x, z). La funcion se discretiza, para cada valor discreto de z se traza lagrafica y = f(x, z = cte), cada valor de z corresponde con un plano, comen-zamos por valores de z que estan mas cercanos al observador y con valores dez que se van alejando de este. Observe en la Figura 8.2 que un segmento de lagrafica y = f(x, z4) debe ocultarse puesto que la grafica anterior y = f(x, z3)la cubre, esta es la base del algoritmo del horizonte flotante que se puedeenunciar de la siguiente manera:

Si para cada valor dado de x, el valor y de la curva en el plano actual esmayor que el valor y para todas las curvas anteriores, entonces la curva esvisible para ese valor especıfico de x, en caso contrario sera invisible.

Para implementar este algoritmo simplemente hay que mantener un ar-reglo del mismo tamano que la resolucion de la imagen en el eje x. Los valoresde este arreglo representan el horizonte y este horizonte “flota” a medida quecada curva es dibujada.

Este algoritmo funciona bien a menos que alguna curva adopte valorespor debajo de los que se han presentado en planos anteriores, por ejemplo,en la Figura 8.3 la curva z = z5 cae por debajo de todas las anteriores y debeser visible en el segmento en el que eso sucede, algo similar se puede decir

8.2. DETERMINACION DE LA ECUACION DE UN PLANO 105

Figura 8.2: Graficacion de una funcion y = f(x, z) mediante el algoritmo delhorizonte flotante

para z = z6. El algoritmo del horizonte flotante se debe adaptar para tomaren cuenta esa posibilidad, el algoritmo serıa entonces:

Si para algun valor dado de x, el valor y correspondiente de la curvaen el plano actual es superior al maximo valor o inferior al mınimo valorentre todas las curvas anteriores, entonces la curva actual en dicho valor xes visible, si no se cumple ninguna de las dos cosas, entonces es invisible.

Para implementar el algoritmo del horizonte flotante se requieren entoncesdos arreglos uno para almacenar los valores maximos y el otro para almacenarlos mınimos, a estos arreglos se les denominan horizontes flotantes superiore inferior respectivamente.

8.2. Determinacion de la ecuacion de un plano

Podemos determinar la ecuacion del plano en el que reside cualquier carade un cuerpo rıgido modelado por un numero finito de ellas. Cualquier punto(x,y,z) que pertenezca al plano cumple con su ecuacion que es:

ax + by + cz + d = 0 (8.1)


Figura 8.3: Necesidad de un horizonte inferior

o su forma normalizada (para la cual d=1) que es:

ax + by + cz = −1 (8.2)

Como tenemos tres incognitas (a, b, c), entonces necesitamos tres ecua-ciones, es decir tres puntos que pertenezcan al plano (siempre y cuandono sean co-lineales), utilizamos por facilidad vertices que definen la caracuyo plano queremos determinar, entonces si tenemos 3 vertices (x1, y1, z1),(x2, y2, z2) y (x3, y3, z3) entonces tenemos que resolver el sistema de ecua-ciones:

ax1 + by1 + cz1 = −1 (8.3)

ax2 + by2 + cz2 = −1 (8.4)

ax3 + by3 + cz3 = −1 (8.5)

en forma matricial tenemos:

x1 y1 z1

x2 y2 z2

x3 y3 z3

abc

=

−1−1−1

(8.6)

8.3. DETERMINACION DEL VECTOR NORMAL A UN PLANO 107

8.3. Determinacion del vector Normal a un

Plano

Una vez que tenemos la ecuacion de un plano ax+by+cz+d = 0 entoncesel vector que es normal a ese plano es:

N = (a, b, c) (8.7)

tambien podemos determinar el vector normal al plano haciendo el pro-ducto cruz o producto vectorial de dos vectores que residan en ese plano,ası es que si tenemos los vertices (x1, y1, z1), (x2, y2, z2) y (x3, y3, z3), en-tonces podemos hacer el producto cruz del vector (x1 − x2, y1 − y2, z1 − z2)y (x1 − x3, y1 − y3, z1 − z3). El vector que resulte sera un vector normal alplano al que pertenecen esos tres puntos no colineales.

8.4. Deteccion de caras posteriores

La deteccion de caras posteriores es un proceso conocido como “Culling”consiste en eliminar aquellas caras de los objetos de una escena que no puedenser vistas desde la perspectiva de cierto observador, este proceso no resuelveel problema mas general en el que unos objetos tapan a otros o ciertas partesde estos, simplemente se encarga de averiguar cuales caras estan ocultas porel mismo objeto al que pertenecen. El algoritmo de Robert resuelve esteproblema de forma muy simple, solo funciona para objetos convexos pero siel objeto es concavo siempre se puede dividir en varios objetos convexos.

8.4.1. Algoritmo de Roberts

Este metodo simplemente dice que una cara es posterior y por ende in-visible a un observador si se cumple que

Np ·N < 0 (8.8)

donde Np es el vector normal al plano al que pertenece la cara en cuestiony N es el vector que describe la direccion de la vista del observador, es decir,si el angulo entre Np y N es un angulo obtuso entonces la cara es posterior,si el angulo entre esos dos vectores es agudo, entonces es una cara visible,


Figura 8.4: Algoritmo de Robert para detectar caras posteriores

observe la Figura 8.4. Finalmente, las lıneas compartidas entre dos carasposteriores son lıneas invisibles.

8.5. Algoritmo del Buffer Z o Buffer de pro-

fundidad

Las partes visibles de una escena se pueden descubrir haciendo algo simi-lar al algoritmo del horizonte flotante, es decir, podemos mantener un arreglocon las distancias desde el observador hasta la superficie mas cercana en cadadireccion que quede dentro del volumen de vision, a diferencia del algoritmodel horizonte flotante, el arreglo que necesitamos aquı es un arreglo bidimen-sional del tamano de la resolucion de la imagen deseada. La distancia delobservador a la superficie mas cercana es la profundidad (en lugar del hor-izonte) y esta se mide normalmente por la coordenada z, por esta razon albuffer de profundidad tambien le llamamos buffer Z. El algoritmo del bufferZ o buffer de profundidad para efectos de deteccion de superficies visibles olo que es lo mismo la eliminacion de superficies ocultas (HSR por HiddenSurface Removal) consiste en lo siguiente:

Supongamos que todos los objetos que forman la escena tienen caras, nosolo se debe pensar en objetos regulares como los cubos que tienen 6 caras opiramides (con 4 caras) sino cualquier tipo de objeto, por ejemplo, una tetera

8.6. ALGORITMO DEL BUFFER A PARA SUPERFICIES TRANSPARENTES109

se puede modelar con alrededor de 500 caras triangulares.Por cada objeto que forma parte de una escena y por cada cara que forma

parte del objeto, determinar los puntos que la forman, por cada punto (x,y,z)de estos, comparar su profundidad z con la profundidad almacenada en elbuffer Z para el correspondiente (x,y), si la profundidad del punto es menor,reemplaza a la del buffer Z. Los valores de profundidad de una cara se puedenobtener a partir de la ecuacion del plano correspondiente a esa cara mediante:

z =−ax− by − d

c(8.9)

Una vez que se hayan procesado todos los puntos de todas las caras detodos los objetos de la escena obtendremos en el buffer Z las profundidadesmas cercanas y podremos saber de que color debe ser cada pixel (x,y) siademas de mantener el buffer Z mantenemos un buffer paralelo denominado“buffer del color”. Cada vez que un valor de profundidad sustituye un valoren el buffer Z se sabe a que cara pertenece el nuevo valor de profundidad yel color de dicha cara se puede almacenar en el buffer del color. En resumen:

IF zs < zbuffer[x,y] THEN

write intensity to colorbuffer[x,y];

write zs to zbuffer[x,y];

END;

La principal ventaja de este metodo es su simplicidad, las desventajasson:

Demasiados calculos innecesarios puesto que en demasiadas ocasioneslos pixels sobreescriben pixels anteriores

Posibles errores de cuantizacion

No soporta objetos transparentes

8.6. Algoritmo del Buffer A para superficies

transparentes

Como se comento en la seccion anterior, el algoritmo del buffer Z nopuede manejar objetos transparentes o con cierto grado de transparencia


(translucidez). El algoritmo del buffer A es en realidad una modificacion delalgoritmo del buffer Z para soportar objetos translucidos, la unica razon porla que recibe ese nombre es por que la A esta en el extremo opuesto a la Zen el alfabeto.

En el buffer A, en lugar de almacenar simplemente un valor de profundi-dad se almacena un apuntador a una lista ligada. Si el primer elemento de lalista es un objeto opaco, entonces la lista termina ahı, si en cambio se tratade un objeto translucido, entonces la lista continua con el siguiente objetomas cercano en la misma direccion, el cual tambien pudiera ser otro objetotranslucido, la lista continua de manera que el ultimo objeto es opaco. Parasaber el color final de un pixel se debe recorrer la lista asociada a ese pixel, elcolor de los objetos translucidos y el objeto opaco de la lista correspondienteal pixel se combina para obtener el color final.

8.7. Algoritmo del Buffer Z por lınea de ras-

treo

Para acelerar el metodo del buffer Z, se puede proceder por lınea derastreo, por cada lınea de rastreo, las posiciones horizontales adyacentes alo largo de la lınea difieren an solo una unidad, si se ha determinado que laprofundidad en la posicion (x,y) es z, entonces la profundidad de la siguienteposicion (x+1,y) sera

z′ =−a(x + 1)− by − d

c= z − a

c(8.10)

El valor a/c permanece constante mientras no nos cambiemos de superficiede manera que al proceder por lınea de rastreo, las profundidades se vandeterminando mediante una simple suma.

8.8. Metodo de proyeccion de rayos

En lugar de procesar cada punto de cada polıgono de cada objeto de unaescena para determinar cual es la profundidad de la superficie mas cercanaal observador en cada pixel del plano de vision podemos de otra manera. Elmetodo de proyeccion de rayos consiste en trazar una lınea perpendicular alplano de vision, determinar a cuales polıgonos intersecta esta lınea y elegir

8.9. METODO DEL ARBOL BSP 111

Figura 8.5: Deteccion de superficies visibles mediante el metodo de trazadode rayos

la interseccion mas cercana al plano de vision, esto se hace por cada pixeldel plano de vision. En la Figura 8.5 se ha trazado un rayo para cierto pixely este intersecta 4 polıgonos (2 caras de la piramide y dos caras del cubo),pero la interseccion mas cercana al plano de vision es la cara que resultarıavisible al menos en lo que concierne al pixel de donde surgio el rayo. En elmetodo del buffer de profundidad se procesan cada uno de los polıgonos dela escena en orden para determinar el mas cercano para cada pixel mientrasque en este metodo se toman los pixels en orden y se sigue un rayo por cadapixel, este metodo ahorra calculos.

8.9. Metodo del arbol BSP

El algoritmo del pintor es probablemente la mas simple de las tecnicaspara resolver el problema de HSR, se trata de ordenar los polıgonos en ordenascendente de profundidad (z) y simplemente desplegarlos completos comen-zando por los de mayor profundidad, los de menor profundidad cubriran alos de mayor profundidad de la misma manera que en un lienzo al pintar unarbol, este cubre la parte del paisaje que queda detras de el. El algoritmo delpintor falla cuando los polıgonos se traslapan como en la Figura 8.6.

Para solucionar el problema de los polıgonos traslapados, se puede dividir


Figura 8.6: El algoritmo del pintor no funciona con polıgonos traslapados

el espacio sucesivamente hasta que las diferentes regiones en las que el espaciose haya dividido sean lo suficientemente pequenas para que en su interiorningun polıgono se traslape en profundidad con ningun otro polıgono. Unarbol BSP (por Binary Space Partitioning) sirve para representar la maneraen que el espacio ha sido dividido. El espacio es particionado estableciendoplanos que dividen a los polıgonos en aquellos que quedan de un lado yaquellos que quedan del otro lado. Un arbol BSP tiene tantos niveles comoplanos divisorios, cada plano divisorio divide el espacio en dos (de ahı lo debinario). En la Figura 8.7, el primer nivel del arbol corresponde con el planoy=512 y el segundo nivel corresponde con el plano x=512, dividiendo de estamanera el espacio en 4 regiones.

8.10. Funciones de OpenGL para suprimir su-

perficies ocultas

OpenGL implementa tanto la eliminacion de caras posteriores (Algoritmode Robert) como la eliminacion de superficies ocultas mediante el metodo delbuffer Z de profundidad. La eliminacion de caras posteriores se lleva a efectomediante las funciones:

glEnable(GL_CULL_FACE);

8.10. FUNCIONES DE OPENGL PARA SUPRIMIR SUPERFICIES OCULTAS113

Figura 8.7: El arbol BSP

glCullFace(modo);

donde modo puede tomar el valor de GL-FRONT, GL-BACK o GL-FRONT-AND-BACK. Utilizamos GL-BACK (El modo predeterminado) paraeliminar caras posteriores, si usamos GL-FRONT se eliminan las caras frontales,esto tiene aplicacion por ejemplo para ver el interior de edificios de departa-mentos. Si utilizamos GL-FRONT-AND-BACK se eliminan tanto las carasfrontales como las posteriores, quedando solamente los puntos y lıneas que noforman polıgonos. La eliminacion de caras se desactiva mediante la funcion:

glDisable(GL_CULL_FACE);

Para usar las rutinas de deteccion de visibilidad mediante buffer de pro-fundidad debemos solicitar que configure un buffer de profundidad y un bufferde refresco (el buffer del color), esto lo hacemos de la siguiente manera:

glutInitDisplayMode(GLUT_SINGLE|GLUT_RGB|GLUT_DEPTH);

Para inicializar el buffer de profundidad y el buffer del color hacemos:

glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);


Como los valores de profundidad en el sistema de coordenadas de pantalla3D estan normalizados y quedan en el rango de cero a uno, esta instruccionasigna puros valores de 1.0 al buffer de profundidad. Finalmente, la deteccionde la visibilidad se activa mediante:

glEnable(GL_DEPTH_TEST);

y se desactiva mediante:

glDisable(GL_DEPTH_TEST);

Capıtulo 9

Iluminacion

Los conceptos de la optica son utiles para decidir como deben ilumi-narse (o sombrearse) las diferentes partes de una escena. Podemos utilizarlos conocidos aspectos acerca de la interaccion de la luz con una superficieen terminos de las propiedades de la superficie misma y de la naturaleza dela luz incidente para determinar el tono final que se debe dar a cada pixel dela escena. Sabemos que hay dos tipos fundamentales de reflexion de la luz, asaber, reflexion difusa y reflexion especular.

9.1. Reflexion Difusa

Dependiendo de las propiedades de una superficie no transparente, cuan-do un rayo de luz incide sobre ella, pueden ocurrir tres cosas, el rayo puedereflejarse en una direccion unica como por ejemplo cuando el rayo incide enun espejo, denominamos a este tipo de reflexion como “especular perfecta”,ver Figura 9.1(a). Si el rayo es reflejado en varias direcciones pero principal-mente en una direccion predominante, decimos que la reflexion es “especularimperfecta”, ver la Figura9.1(b), este tipo de reflexion la encontramos enobjetos brillantes, por ejemplo en un florero de plata. Finalmente, si despuesde incidir un rayo de luz en una superficie el rayo es reflejado de manerauniforme en todas direcciones, decimos que la reflexion es “difusa” como enla Figura 9.1(c), este tipo de reflexion la encontramos en objetos opacos.

115

116 CAPITULO 9. ILUMINACION

Figura 9.1: Tipos de reflexion luminosa

9.2. Ecuacion de Lambert

En la reflexion difusa la intensidad de luz parece ser la misma cuandola superficie se observa desde cualquier direccion. La intensidad no dependepues de la ubicacion del observador pero si depende de la orientacion quela superficie tiene respecto a la fuente de luz. La ecuacion de Lambert nosdice que la intensidad de luz en una superficie debida a la reflexion difusa secalcula como:

Id = Iicosθ = Ii(L ·N) 0 ≤ θ ≤ 2π (9.1)

donde Ii es la intensidad de la luz incidente, θ es el angulo entre el vectorL que apunta hacia la fuente de luz desde la superficie en cuestion y el vectorN que es normal a la superficie, ver la Figuras 9.2 y 9.3

Para multiples fuentes de luz, la ecuacion de Lambert se convierte en

Id =∑

n

Ii,n(Ln ·N) (9.2)

donde Ii,n es la intensidad de luz que incide desde la n-esima fuente deluz, Ln es el vector que apunta hacia la n-esima fuente de luz y N es de nuevoel vector normal a la superficie en el punto en donde se esta calculando lailuminacion (N no depende de n)

9.2. ECUACION DE LAMBERT 117

Figura 9.2: La reflexion difusa y definicion de los vectores L y N involucradosen la ecuacion de Lambert

Figura 9.3: La ecuacion de Lambert


9.3. Reflexion Especular

La cantidad de luz que se ve reflejada en un punto especıfico de unasuperficie donde la luz se refleja de forma especular depende de la posiciondel observador y no solo de la posicion de la fuente de luz, suponga porejemplo que un florero de plata es iluminado por una lampara incandescentey hay varios observadores ubicados en posiciones distintas, entonces ellosveran que el florero refleja una luz brillante pero cada uno de ellos vera esebrillo reflejado en un lugar distinto en el florero. Por la razon aquı expuestaes que la formula para calcular la intensidad de luz que un punto de unasuperficie refleja especularmente toma en cuenta no solo la direccion hacia lafuente de luz y la direccion normal a la superficie sino la direccion hacia elobservador, la formula es:

Is = IicosnΩ = Ii(R · V )n (9.3)

donde Ii es la intensidad de la luz incidente, V es el vector que tienela direccion hacia el observador Ω es el angulo entre la direccion hacia elobservador y la direccion R que es el vector L “reflejado” a traves del vectorN (Normal al plano), ası el angulo θ entre L y N es el mismo angulo quehay entre N y R, vea la Figura 9.4. Finalmente, n es un indicador del gradode perfeccion de la reflexion especular, a medida que n aumenta la reflexionespecular se parece mas a la reflexion especular perfecta, vea la Figura 9.5.

9.4. Modelado de la Iluminacion

Las reflexion no necesariamente es solamente difusa o solamente espec-ular, se puede dar una combinacion de reflexiones, es decir, la luz reflejadapuede tener un componente difuso y un componente especular e incluso untercer componente que es la luz reflejada que no proviene de una fuente de luzpuntual sino de la contribucion de luz reflejada de todas direcciones (la luzque rebota de todos los objetos y que va a dar al punto donde estamos calcu-lando el brillo), llamamos a este componente la luz ambiental. La siguienteecuacion toma en cuanta estos tres factores y se conoce como el “Modelo deiluminacion de Phong”

I = kaIa + Ii(kd(L ·N) + ks(R · V )n) (9.4)

9.4. MODELADO DE LA ILUMINACION 119

Figura 9.4: Determinacion de la reflexion especular

Figura 9.5: Impacto del exponente n (grado de perfeccion de la reflexionespecular)


donde ka es el factor de reflexion de la superficie a la luz ambiental, kd yks son el factor de reflexion difusa y de la reflexion especular de la superficierespectivamente.

En algunos paquetes graficos el modelo de iluminacion de Phong se modi-fica para incluir un factor de atenuacion, despues de todo, las lamparas tienennormalmente un cierto alcance y la luz se va atenuando a medida que nosalejamos de estas, en la ecuacion:

I = kaIa + fattIi(kd(L ·N) + ks(R · V )n) (9.5)

donde fatt = 1/d2 y d es la distancia a la fuente de luz.

El modelo de iluminacion de Phong y cualquiera de sus variantes es con-siderado un modelo de iluminacion local debido a que solo toma en cuantaaspectos locales (excepto por el termino de luz ambiental) pero existen mod-elos de iluminacion mucho mas elaborados que toman en cuenta no solo laluz que llega directamente de la fuente de luz sino indirectamente, es decir,reflejada de otros objetos cercanos al punto donde queremos determinar elnivel de iluminacion, este tipo de modelos se conocen como “globales” y losmas conocidos son el metodo de trazado de rayos y el de radiosidad que sediscuten mas adelante.

9.5. Determinacion del vector Normal a un

vertice

Hemos visto como determinar el vector normal a un plano, sin embargo,las interpolaciones necesarias para renderizar un objeto de manera que estese vea mas real como el sombreado de Gourad o el de Phong que se veran enlas siguientes dos secciones utilizan el concepto de vector normal a un vertice,el cual es simplemente el promedio de los vectores normales a los polıgonosque comparten al vertice como se aprecia en la Figura 9.6, entonces, el vectorNormal a un vertice se determina mediante la siguiente formula:

Nv =

∑nk=i Nk

|∑nk=i Nk| (9.6)

9.6. SOMBREADO DE GOURAD 121

Figura 9.6: Las normales que participan en la determinacion de la normal alvertice A

9.6. Sombreado de Gourad

Para lograr que un objeto construido a base de cientos de polıgonos luzcacomo si estuviera hecho por suaves superficies curvas se puede utilizar lainterpolacion de Gourad, tambien llamada sombreado de Gourad. Hay queentender que los valores de intensidad de luz obtenidos con el modelo dePhong o alguna variante se calculan solo en los vertices, si mantenemos esaintensidad constante hasta llegar al siguiente vertice, entonces los polıgonosque conforman el objeto van a ser muy evidentes. Si en cambio, los valoresde intensidad se van cambiando gradualmente entre un vertice y otro (porinterpolacion entre las intensidades de ambos vertices), entonces obtendremosun objeto que luce bastante real. El proceso de sombreado de Gourad de cadapolıgono de que esta hecho el objeto consiste en:

Determinar el vector normal en cada uno de los vertices del polıgono

Aplicar el modelo de iluminacion de Phong o alguna variante paradeterminar la intensidad en cada vertice

Interpolar linealmente las intensidades de los vertices para determinar


la intensidad en cada pixel que forma parte del polıgono

Se van determinando los valores de intensidad a lo largo de cada lınea derastreo donde se ubica el polıgono. Asi, considere que se van a determinarlos valores a los largo de la lınea de rastreo que se muestra en la Figura 9.7,para ello debemos determinar primero las intensidades en los extremos de lalınea de rastreo en la frontera del polıgono, es decir los valores Ia e Ib de lasiguiente manera:

Ia =I2(ys − y0) + I0(y2 − ys)

y2 − y0

(9.7)

Ib =I1(ys − y0) + I0(y1 − ys)

y1 − y0

(9.8)

Una vez que se han calculado las intensidades en los extremos de la lıneade rastreo la intensidad en cada pixel que forma parte de la lınea se determinainterpolando Ia e Ib de la siguiente manera:

Is =Ia(xb − xs) + Ib(xs − xa)

xb − xa

(9.9)

Para acelerar el sombreado de Gourad se pueden realizar calculos incre-mentales a lo largo de la lınea de rastreo, es decir, modificar el valor dela intensidad del pixel anterior simplemente sumandole una constante ∆Is

(diferente para cada lınea de rastreo) para determinar la intensidad del pixelactual de la siguiente manera:

Is,n = Is,n−1 + ∆Is (9.10)

donde ∆Is = (Ib − Ia)/(xb − xa)

9.7. Sombreado de Phong

El sombreado de Gourad no es adecuado cuando para la reflexion espec-ular, la solucion consiste en que en lugar de interpolar intensidades lumi-nosas interpolemos las normales de los vertices de manera que obtengamosun vector normal en cada pixel del polıgono. Por ejemplo, en la Figura 9.8diferentes vectores normales son obtenidos interpolando los vectores NA y

9.7. SOMBREADO DE PHONG 123

Figura 9.7: Interpolacion de Gourad a lo largo de una lınea de rastreo

Figura 9.8: Interpolacion de Phong


NB, mas parecidos a NA para pixeles cercanos al vertice izquierdo y cada vezmas parecidos a NB a medida que nos acercamos al vertice derecho.

Una vez que se han obtenidos los vectores normales para cada pixel delpolıgono se calcula la intensidad luminosa de acuerdo al modelo de Phong oalguna de sus variantes. Este metodo es obviamente mas costoso que el delsombreado de Gourad pero se obtiene mejores resultados en lo concernientea la reflexion especular, por supuesto si no hay reflexion especular no tienecaso utilizar la interpolacion de Phong.

9.8. Funciones de OpenGL para manejo de

Iluminacion

Para definir una fuente de luz, debemos establecer sus parametros. Lasiguientes dos lıneas establecen una fuente de luz en la posicion (-2,2,2),el cuarto elemento del arreglo light-pos indica si los tres elementos anteri-ores del arreglo se deben interpretar como una posicion (uno) o como unadireccion (cero) lo cual implica que la luz se considera local o muy lejanarespectivamente [5].

GLFloat light_pos[]=(-2.0,2.0,2.0,1.0);

glLightfv(GL_LIGHT0,GL_POSITION,light_pos);

Las siguientes dos lıneas sirven para especificar la luz ambiental comoblanca (primeros tres valores del arreglo light-Ka)

GLFloat light_Ka[]=(1.0,1.0,1.0,1.0);

glLightfv(GL_LIGHT0,GL_AMBIENT,light_Ka);

Las siguientes dos lıneas sirven para especificar la luz difusa como blanca(primeros tres valores del arreglo light-Kd)

GLFloat light_Kd[]=(1.0,1.0,1.0,1.0);

glLightfv(GL_LIGHT0,GL_DIFFUSE,light_Kd);

Las siguientes dos lıneas sirven para especificar la luz especular comoblanca (primeros tres valores del arreglo light-Ks)

GLFloat light_Ks[]=(1.0,1.0,1.0,1.0);

glLightfv(GL_LIGHT0,GL_SPECULAR,light_Ks);

9.9. ILUMINACION POR PROYECCION DE RAYOS 125

Los coeficientes de reflexion dependen del material del que estan hechoslos objetos, las siguientes dos lıneas sirven para especificar una superficie queal incidir luz ambiental blanca la reflejara roja

GLFloat material_Ka[]=(1.0,0.0,0.0,1.0);

glMaterialfv(GL_FRONT,GL_AMBIENT,material_Ka);

Las siguientes dos lıneas sirven para especificar los coeficientes de reflexiondifusa para cada uno de los tres colores basicos.


glMaterialfv(GL_FRONT,GL_DIFFUSE,material_Kd);

Las siguientes dos lıneas sirven para especificar los coeficientes de reflexionespecular para cada uno de los tres colores basicos.


glMaterialfv(GL_FRONT,GL_SPECULAR,material_Kd);

Las siguientes dos lıneas sirven para especificar que un objeto tiene luzpropia y el color de esta.

GLFloat material_Ke[]=(1.0,1.0,1.0,1.0);

glMaterialfv(GL_FRONT,GL_EMISSION,material_Ke);

La siguiente lınea sirve para especificar que tan perfecta es la reflexionespecular, es decir, el exponente n del modelo de iluminacion de Phong, eneste ejemplo se le asigna el valor de 10.

glMaterialfv(GL_FRONT,GL_SHININESS,10);

9.9. Iluminacion por proyeccion de Rayos

El modelo de reflexion de Phong es un modelo local puesto que soloconsidera la reflexion de la luz que proviene directamente de la(s) fuente(s)de luz. Un modelo de reflexion global toma en cuenta tambien la luz que llegade manera indirecta, es decir, la luz reflejada de un tercer objeto [6], [7].

El modelo de iluminacion por proyeccion de rayos toma en cuenta lainteraccion especular global y es dependiente del observador. Existen dos


formas de realizar la proyeccion de los rayos, de la fuente de luz hacia lospolıgonos o de los polıgonos hacia la fuente de luz, siendo esta ultima la masfacil de implementar.

La proyeccion recursiva de rayos es un metodo que resuelve simultanea-mente los siguientes problemas:

Deteccion de superficies visibles

Sombreado por iluminacion directa

Agregar efectos de reflexion especular global

Determinacion de la geometrıa de las sombras

El modelo considera que la intensidad de luz en cada punto tienen trescomponentes, la contribucion de luz reflejada de otros objetos, la contribucionde luz transmitida (en caso de ser un objeto translucido) que proviene deotro objeto y la contribucion local. La intensidad de luz I(P ) en cierto puntoP se determina sumando tres terminos, el primero es la contribucion local(Ilocal(P )) y se determina con el modelo de Phong, el segundo es la cantidadde luz reflejada dependiendo del coeficiente de reflexion Krg y de la cantidadde luz I(Pr) reflejada de por otro punto (Pr) y que a su vez se determina dela misma manera (es un metodo recursivo). El tercer termino es la cantidadde luz transmitida (refractada) que depende del coeficiente de refraccion Ktg)y de la cantidad de luz refractada I(Pt) que proviene de algun punto Pt yque a su vez se calcula de la misma manera. En resumen usamos la siguienteformula:

I(P ) = Ilocal(P ) + KrgI(Pr) + KtgI(Pt) (9.11)

La determinacion de I(P ) en la formula anterior es un proceso recursivoya que para determinar I(Pr) e I(Pt) se hace uso de la misma formula.

Cabe aclarar que en este metodo la reflexion difusa se calcula solo demanera local, es decir, sin tomar en cuenta la luz que llega de manera indi-recta, solo toma en cuenta la luz que llega directamente de la fuente de luz,en cambio, se modela la reflexion especular de manera global.

En la Figura 9.9 se muestra el metodo de proyeccion de rayos, en su ver-sion mas simple se proyecta un solo rayo por cada pixel del plano de vision,dicho rayo sigue una direccion ortogonal al plano de vision. Se encuentra laprimera interseccion del rayo inicial con un punto, en el ejemplo este punto ha

9.9. ILUMINACION POR PROYECCION DE RAYOS 127

sido etiquetado cono el numero 1 y pertenece a una esfera semi-transparente.Para determinar la intensidad luminosa en el punto 1, se suman las contribu-ciones de las luces que le llegan:

1. Directamente de la fuente de luz. Con la lınea punteada se indica ladireccion hacia la fuente de luz, tambien se indica la direccion de lanormal a la superficie donde esta el punto, la direccion del observadorserıa la del rayo inicial. Estas direcciones se deben conocer para podercalcular la contribucion local usando el modelo de Phong o alguna desus variantes.

2. La luz que llega al punto 1 reflejada de el objeto mas cercano que seencuentre en la direccion de reflexion R, recordemos que esta direccionesta a un angulo θ respecto a la normal, mismo angulo que tiene elrayo incidente respecto a la normal. En el ejemplo, el rayo proyectadoen la direccion de reflexion intersecta con el punto 4 que pertenece aun objeto opaco, la cantidad de luz en el punto 4 a su vez se calculasiguiendo el mismo metodo, es decir calculando la contribucion directade la fuente de luz y la que le llega reflejada de algun otro objeto enla direccion de reflexion (dado que es un objeto opaco no se sigue ladireccion de refraccion).

3. La luz que llega al punto uno refractada desde el objeto mas cercanoen la direccion de transmision que en este ejemplo es donde se ubica elpunto 2 que en este caso pertenece al mismo objeto semi-transparentey cuya intensidad se calcula de la misma manera.

Tal como se ilustra en la Figura 9.9 para implementar este metodo con-viene construir un arbol donde se van guardando las diferentes contribucionesde luz, las hojas de este arbol son las primeras en tener completa su infor-macion y la raız es la ultima en completarla, entonces se puede decir cuales la intensidad de luz que corresponde a un pixel. La altura del arbol esun parametro que se interpreta como el numero de intersecciones que se de-sea encontrar cuando se le da seguimiento al rayo, un arbol de mayor alturacorresponde con una mejor renderizacion pero evidentemente mas costosa.

Para encontrar la direccion de refraccion T usamos la ley de Snell

T = −η1

η2

L−(cosθ2 − η1

η2

cosθ1

)N (9.12)


Figura 9.9: Iluminacion mediante proyeccion de rayos

9.10. RADIOSIDAD 129

Figura 9.10: Determinacion de la Direccion de Refraccion

donde η1 es el ındice de refraccion del material incidente y η2 es el ındicede refraccion del material refractante. En la tabla 9.1 se muestran los ındicesde refraccion de algunos materiales [8].

9.10. Radiosidad

Este metodo toma en cuenta la interaccion global de la reflexion difusay es independiente de la posicion del observador, a diferencia del metodode proyeccion de rayos el metodo de radiosidad no resuelve el problema dela deteccion de superficies visibles. El metodo de radiosidad divide a todoslos objetos de una escena en parches y cada parche recibe luz de todos losdemas parches de la escena y no solo de una direccion como en el metodo deproyeccion de rayos. Se asume que todas las superficies son difusores prefec-tos, es decir, que la luz incidente es reflejada de manera uniforme en todasdirecciones. Cada parche recibe luz de cada uno de los demas parches y lainteraccion entre ellos depende de la relacion geometrica que hay entre losmismos y solo de eso por lo cual la solucion es independiente de la ubicaciondel observador. Como la complejidad de este metodo es O(n2), entonces seprocura hacer parches grandes (compuestos de muchos polıgonos).

Un “factor de forma” nos indica en que proporcion la luz reflejada porun parche incide en otro parche. El factor de forma entre dos parches de


Tabla 9.1: Indices de refraccion de algunos materiales

Azucar 1.56Diamante 2.417

Mica 1.56-1.6Benceno 1.504Glicerina 1.47

Agua 1.333Alcohol etılico 1.362Aceite de oliva 1.46

area Ai y Aj se calcula integrando el area de ambos parches para todos losdiferenciales de area de ambos parches como se indica en la siguiente ecuacion.En la Figura 9.11 se definen graficamente las variables involucradas

FAiAj= Fij =

1

Ai

∫

Ai

∫

Aj

cosφicosφj

πr2dAjdAi (9.13)

Si r es razonablemente grande:

Fij ≈∫

Aj

cosφicosφj

πr2dAj (9.14)

La radiosidad B se define como la energıa luminosa por unidad de areaque sale de una superficie en cada instante, la cual es la suma de la energıaluminosa reflejada y la luz propia que algunas superficies tienen capacidad deproducir. La radiosidad multiplicada por el area es igual a la energıa propiaemitida mas la energıa reflejada. Para un parche Ai:

BidAi = EidAi + Ri

∫

j

BjFijdAj (9.15)

donde Ri es la fraccion de luz reflejada (el coeficiente de reflexion)La relacion de reciprocidad nos dice que:

FijAi = FjiAj (9.16)

dividiendo la ecuacion (9.15) por dAi obtenemos:

9.10. RADIOSIDAD 131

Figura 9.11: Determinacion de los factores de forma

Bi = Ei + Ri

∫

j

BjFij (9.17)

En un ambiente discreto, la integral es reemplazada por una sumatoria:

Bi = Ei + Ri

n∑j=1

BjFij (9.18)

Tal ecuacion existe para cada parche, rearreglando:

Bi −Ri

n∑j=1

BjFij = Ei (9.19)

Involucrando a todos los parches, (eq:radio4) se convierte en un sistemade n ecuaciones simultaneas con n incognitas (los valores Bi). El metodo deradiosidad consiste justamente en resolver este sistema de ecuaciones:

1−R1F11 −R1F12 ... −R1F1n

−R2F21 1−R2F22 ... −R2F2n

: : : :−RnFn1 1−RnFn2 ... −RnFnn

B1

B2

:Bn

=

E1

E2

:En

(9.20)


Ei son las fuentes de luz de la escena, la mayorıa de los elementos de esevector valen cero. Para resolver este sistema se suele utilizar un algoritmoiterativo como el Gauss-Seidel para poder obtener soluciones parciales (de-spues de un cierto numero de iteraciones) debido a que la solucion exacta esdemasiado costosa

9.11. Funciones de OpenGL para iluminacion

OpenGl no soporta las tecnicas de radiosidad ni de trazado de rayos [7],[5], [4].

Bibliografıa

[1] D. F. Rogers, Procedural Elements for Computer Graphics. MacGrawHill, 1985.

[2] D. Hearn and P. M. Baker, Graficos por computadora con OpenGL. 3aEdicion, 3rd ed. Prentice Hall, 2006.

[3] S. Harrington, Computer Graphics. A programming approach. MacGrawHill, 1987.

[4] D. Shreiner, M. Woo, J.Neider, and T. Davis, OpenGL ProgrammingGuide. (The Red book) Fifth edition, 5th ed.

[5] S. R. Buss, 3-D Computer Graphics. A Mathematical Introduction withOpenGL. Cambridge University Press, 2003.

[6] A. Watt, 3D Computer Graphics. Tercera Edition, 3rd ed. AddissonWesley, 2000.

[7] L. Ammeraal and K. Zhang, Computer Graphics for Java Programmers.Second Edition, 2nd ed. John Wiley and Sons, 2007.

[8] N. I. Koshkin and M. G. Shirkevich, Manual de Fısica elemental. MIR,1975.

133

univ. michoacana de san nicolas de hgo. facultad …camarena/notasgraficacion.pdfvideo-juegos....

Documents