http://graficos.conclase.net/curso/?

cap=006c

Transformaciones Afines
^

Una transformacin es una funcin que acepta un punto y lo convierte - siguiendo alguna lgica o
algoritmo - en otro punto. Asimismo se puede decir de una transformacin de un vector a otro
vector. Si usamos coordenadas homogneas, podemos representar cualquier transformacin usando
la misma funcin para aceptar tanto puntos como vectores. El problema es que esta definicin es
demasiado general para nuestros propsitos. Como vamos a estar manejando objetos geomtricos
ms complicados que puntos y vectores, sera imprctico aplicar la misma transformacin a cada
punto y vector que compone nuestros objetos en nuestra escena y en nuestra imagen.
Necesitamos limitar las transformaciones que queremos usar. La restriccin ms importante es la
linealidad. Sin entrar en mucho detalle, el uso de transformaciones lineales supone que una lnea se
convierte en una lnea. De esta manera, podemos transformar los puntos finales que describen un
segmento para as transformar tal segmento, sin tener que transformar todos los puntos que
comprenden tal segmento. Usando coordenadas homogneas, tales transformaciones implicarn
una multiplicacin matricial. Podemos representar tal transformacin entre a y b, que pueden
representar tanto puntos como vectores, de esta manera,
a = b M

Como podemos ver, esta frmula es idntica a la que usamos para el cambio de marco de referencia.
Por lo tanto, una transformacin lineal corresponde a un cambio de marco. Dicho esto, declaramos
que una transformacin es a) un cambio de representacin de los objetos de un marco de referencia
a otro o b) un cambo de las figuras de los objetos dentro del mismo marco de referencia.
Volviendo a la matriz en coordenadas homogneas,
M =

( a11 a12 0 )
( a21 a22 0 )
( a31 a32 1 )

vemos que slo tenemos 6 elementos con los que trabajar de los 9 que existen en una matriz de 3x3.
Tcnicamente, decimos que esta matriz tiene 6 grados de libertad. Sin embargo, al aplicar este tipo
de matrices para transformar un punto o un vector, podemos deducir dos tipos de matrices
diferentes. Como un vector se define as,
v = ( vxvy 0 )

la transformacin acaba siendo la siguiente matriz,

Mvector =

( a11 a12 0 )
( a21 a22 0 )
( 0 0 1 )

Como la coordenada homognea de un vector es cero, los elementos a y a de la matriz no influyen

en el resultado de la multiplicacin.
31

32

Para transformar un punto, descrito como,

P = ( PxPy 1 )

la transformacin es la siguiente matriz,

Mpunto =

( a11 a12 0 )
( a21 a22 0 )
( a31 a32 1 )

Por lo tanto, existen 4 grados de libertad para una transformacin de vectores, pero usamos los 6
grados para las transformaciones afines con puntos.

Operaciones
^

Existen cuatro transformaciones afines: traslacin, cambio de escala, rotacin, y sesgado o

transveccin. Usando coordenadas homogneas, cada transformacin se puede representar como
una matriz de 3x3 de la forma,

( a11 a12 0 )
M = ( a21 a22 0 )
( a31 a32 1 )

Traslacin

Se trata de una operacin que desplaza un punto una distancia fija en una direccin y sentido
concretos. El parmetro que se necesita es simplemente un vector a modo de desplazamiento: d =
( d , d ),
x

P = P + d

donde,
P = ( PxPy 1 )
P = ( PxPy 1 )
d = ( dxdy 0 )

Podemos reescribir estas ecuaciones por componentes,

Px = Px + dx
Py = Py + dy

Figura 11 - Traslacin de
varios puntos por un vectord
Como vemos, una traslacin trata de una suma. Esto va en contra de la multiplicacin matricial que
hemos estado aplicando hasta estos momentos. Sin embargo, no tenemos un grave problema al usar
coordenadas homogneas,
P = P T

donde,
( 1 0 0 )
T = ( 0 1 0 )
( dxdy 1 )

Analizando esta matriz, vemos que tiene 2 grados de libertad. Por ello, solemos describir una
traslacin como una funcin que acepta dos parmetros: T(d ,d ).
x

Como no podemos conseguir el mismo resultado con una matriz de 2x2, se usa una matriz de 3x3 y
coordenadas homogneas como una forma ingeniosa de convertir una suma a una multiplicacin.
Esto nos permitir "encadenar" las transformaciones como multiplicaciones entre matrices. Con una
suma de por medio, no podrmos hacer tal "encadenacin", ya que las multiplicaciones se deben
realizar antes de las sumas.
Podramos calcular la inversa de la matriz de traslacin con el algoritmo general. Sin embargo, para
la traslacin, existe una solucin sencilla basada en la geometra. La inversa de una traslacin es
sencillamente otra traslacin en el sentido contrario. Esto es,
T =

(
(
(

1 0 0 )
0 1 0 )
dxdy 1 )

T-1 =

( 1 0 0 )
( 0 1 0 )
( -dx -dy 1 )

Veamos un ejemplo sencillo, desplazando un punto, P = ( 3, -1 ), una distancia de d = ( -4, 5 ),

P = P T(-4,5)
( PxPy 1 ) =
P = ( -1 4 1 )

( 1 0
( 3 -1
( -4 5

0 )
1 ) (
1 )

0 )

Figura 12 - Traslacin de P=(3,-1) por el

vector d=(-4,5) dando P=(-1,4)
Cambio de Escala

Esta operacin sirve para modificar proporcional, pero no necesariamente uniformemente, los
valores que representan los puntos o vectores a travs de dos factores; uno para cada dimensin.
Este factor multiplica cada valor de la entidad - punto o vector - en cuestin aumentando o
reduciendo tal valor. Al aplicar esta operacin a un objeto compuesto por segmentos, el resultado
visual ser el de un cambio de tamao. Algebraicamente, expresamos esta operacin de la siguiente
manera:
Px = Px * sx
Py = Py * sy

donde, P contiene las coordenadas del punto original, P las del punto transformado, y s y s son los
factores para el cambio de escala:
x

P = ( PxPy 1 )
P = ( PxPy 1 )

En forma matricial, obtenemos la siguiente frmula:

P = P S

donde,
S =

( sx 0 0 )
( 0 sy 0 )
( 0 0 1 )

Figura 13 - Cambio de
escala del punto P por
los factores sx y sy
Como ocurre con la matriz de traslacin, la matriz para el cambio de escala tambin tiene 2 grados
de libertad. Asimismo podemos representar esta operacin como una funcin que acepta dos
parmetros: S(s ,s ).
x

Adems de agrandar y reducir el tamao, podemos crear el efecto de reflejo al usar nmeros
negativos. Tambin hay que tener en cuenta que al multiplicar por un punto, ste puede cambiar de
posicin. Como esto no ocurre con el origen, (0,0), podemos multiplicar cualquier factor por este
punto, sin variarlo. Por lo tanto, se suele elegir el origen para fijar un punto al aplicar un cambio de
escala.
La inversa de una matriz de cambio de escala es simplemente la inversa de la multiplicacin: la
divisin. Esto es,
( sx 0 0 )
S = ( 0sy 0 )
( 0 0 1 )
( 1/sx 0
S-1 = ( 0
1/sy
( 0
0

0 )
0 )
1 )

Ejemplo
Veamos un ejemplo, para aumentar y aplicar reflejo al siguiente punto, P = ( 3, -1 ), por los
factores, s = 2 y s = -4,
x

P = P S(2,-4)

( 2 0
( 3 -1
( 0 0

( PxPy 1 ) =

0 )
1 ) (
1 )

0 -4

0 )

P = ( 6 4 1 )

Figura 14 - Cambio de escala de P=(3,-1) por los factores

sx=2 y sy=-3 dando P=(6,4)
Rotacin

En esta operacin, el punto es transformado siguiendo el camino de una circunferencia con el origen
como su centro. El camino a recorrer depende del ngulo indicado. Las siguientes ecuaciones
describen esta operacin usando forma polar,
Px = r * cos
Py = r * sen
Px = r * cos( + )
Py = r * sen( + )

donde, P es el punto original, P el punto transformado, r es el radio en forma polar, y y son los
ngulos inicial y final, respectivamente:
P = ( PxPy 1 )
P = ( PxPy 1 )

Usando identidades trigonomtricas, sustituimos los cosenos y senos de una suma de ngulos por
expresiones equivalentes. Obtenemos la siguiente ecuacin,
Px = r * cos cos - r * sen sen
Py = r * sen cos + r * cos sen

Aplicando las definiciones anteriores a estas ecuaciones, obtenemos que,

Px = Px cos - Pysen
Py = Py cos + Pxsen

=
=

Px cos - Pysen
Pxsen + Py cos

En forma matricial, obtenemos la siguiente frmula:

P = P R

donde,
( cos
R = ( -sen
( 0

sen
cos
0

0 )
0 )
1 )

Figura 15 - Rotacin del

punto P por el ngulo
Esta matriz de rotacin supone 4 grados de libertad y slo requiere un parmetro: el ngulo de
rotacin. El ngulo se interpreta como positivo en el sentido contrario de las agujas del reloj a partir
del eje X del marco de referencia. Podemos definir la rotacin como una funcin, escribiendo: R().
La inversa de una rotacin es sencillamente otra rotacin con el mismo ngulo pero negativo, para
indicar un sentido contrario del ngulo original. Esto es,
( cos
R = ( -sen
( 0
0
(

sen 0 )
cos 0 )
1 )

cos -sen -

0 )

cos -sen

0 )

R-1 = ( -sen -
( 0
0

cos -
1 )

0 )

=
(

(
0

sen
0

cos 0 )
1 )

Ejemplo
Veamos un ejemplo para rotar el siguiente punto, P = ( 3, -1 ), por el ngulo = /4 (45).
P = P R(/4)

( cos /4 sen/4 0 )
( PxPy 1 ) = ( 3 -1 1 ) ( -sen /4 cos /4
( 0
0
1 )
( 2/2
P = ( 3 -1 1 ) ( -2/2
( 0

2/2
2/2
0

0 )

0 )
0 )
1 )

P = ( 2,8284 1,4142 1 )

Figura 16 - Rotacin del punto P=(3,-1) por el

ngulo =/4

Sesgado

La transveccin o el sesgado trata de mudar todas las entidades en la misma direccin a lo largo de
un eje. Esta combinacin de traslacin y cambio de escala "deforma" las entidades, tirando de ellas
en ambos sentidos en la misma direccin. La deformacin se basa en el ngulo, , formado por el eje
elegido y la lnea que corta el eje elegido y contiene los nuevos puntos transformados. Las ecuaciones
que describen esta operacin a lo largo del eje X son las siguientes,
Px = Px + Pycotg
Py = Py

donde,
P = ( PxPy 1 )
P = ( PxPy 1 )

Esto nos lleva a la siguiente forma matricial,

P = P Hx

donde,
(
Hx = (
(

1
0 0 )
cotg 1 0 )
0
0 1 )

Figura 17 - Sesgado del punto P

por el eje X con ngulo
Podemos observar perfectamente que esta matriz slo tiene 1 grado de libertad. Debemos tener
cuidado con los valores de , ya que la cotangente puede dispararse hacia el infinito, si el ngulo es 0
(180). La restriccin para el ngulo es la siguiente: 0 < < y - < < 0. No tiene sentido que
el ngulo se salga de este intervalo, pero s hay que tenerlo presente. Tambin observamos que no
existe un sesgado con un ngulo de 90. Esta transformacin se puede describir como una
funcin:H ().
x

Realizar la operacin inversa de un sesgado supone otro sesgado con el mismo ngulo en forma
negativa. Esto es,
(
Hx = (
(

1
0 0 )
cotg 1 0 )
0
0 1 )

(
Hx-1 = (
(

1
0 0 )
cotg - 1 0 )
0
0 1 )

(
1
0 0 )
= ( -cotg 1 0 )
(
0
0 1 )

Para conseguir la matriz para el sesgado a lo largo del eje Y, derivamos las ecuaciones de una manera
muy parecida:
Px = Px
Py = Pxcotg + Py

Obtendramos la siguiente matriz,

( 1 cotg
Hy = ( 0
1
( 0
0

0 )
0 )
1 )

Ejemplo
Veamos un ejemplo sesgando el punto, P = ( 3, -1 ), por el eje X formando el ngulo = /4 (45).
P = P Hx(/4)

(
1
( PxPy 1 ) = ( 3 -1 1 ) (
(
0
( 1
P = ( 3 -1 1 ) ( 1
( 0

0
1
0

0 0 )
cotg /4 1
0 1 )

0 )

0 )
0 )
1 )

P = ( 2 -1 1 )

Figura 18 - Sesgado del punto P=(3,-1) por

el eje X con ngulo =/4
Uso de Transformaciones
^

Las transformaciones bsicas que se han visto hasta ahora controlan las entidades - puntos y
vectores - que operan, con resultados diferentes. Analizando estas transformaciones, podemos
clasificarlas segn el efecto, que provocan, de las entidades resultantes. Se suele hablar de
transformaciones de "cuerpo rgido", que son aquellas transforamciones cuyos cuerpos no sufren
deformaciones. Cualquier secuencia de traslaciones y rotaciones cumple con este criterio, ya que no
distorsiona el objeto, conservando el paralelismo y las longitudes de las lneas al igual que los
ngulos. Sin embargo, operaciones que incluyan cambios de escala y sesgados moldean los cuerpos,
por lo que no conservan las longitudes de las lneas ni los ngulos. Aun existiendo estas diferencias,
s podemos garantizar que cualquier transformacin afn conserva el paralelismo de las lneas.
Con estas transformaciones, podemos crear nuevas operaciones compuestas por las operaciones
bsicas. Para llevar a cabo esta composicin, aplicamos una serie de transformaciones
multiplicndolas por cada entidad a transformar. Multiplicamos la matriz, que representa la
transformacin, por el punto o vector. Esto es,
P
P
P
P
P

.
.
.
P

P
P
P
P
P

M0
M1
M2
M3
M4

P Mn

Como se trata de multiplicaciones de varias transformaciones, M , aplicadas a los mismos puntos

original y transformados, P, podemos agrupar estas matrices de transformaciones en una serie de
multiplicaciones. Esto es,
n

P P M0M1M2 Mn

Podemos agregar ms matrices al producto para aplicar ms transformaciones, creando una

encadenacin. Al multiplicar todas las matrices de transformacin, terminaremos con una sola
matriz que recoge todas las transformaciones aplicadas a la entidad en cuestin. De esta manera,
podemos multiplicar varias matrices iguales para luego multiplicar la transformacin resultante a
todas las entidades que nos interesan. Esto optimiza la cantidad de multiplicaciones que debemos
hacer. Por ejemplo,
M M0M1M2 Mn
P0
P1
P2
P3

.
.
.
Pn

P0M
P1M
P2M
P3M

PnM

Composicin

Veamos algunas transformaciones compuestas que nos pueden ser tiles en el manejo de nuestros
modelos 2D. Debemos tener presente que una secuencia de transformaciones no es necesariamente
igual
a
la
misma
secuencia
en
diferente
orden.
Por
ejemplo,
la
secuencia T R T S S T T R S T R T. Obviamente, esto tiene sentido, ya que no existe la
propiedad conmutativa para las matrices.
El primer ejemplo que trataremos es rotar un objeto por un punto fijo. Como ya hemos explicado, la
rotacin se realiza por el origen (0,0). Para rotar por otro punto, simplemente mudamos ese punto
fijo al origen, rotamos por el origen, y luego devolvemos el punto a las coordenadas del punto fijo.
Algebraicamente, representamos esta idea de la siguiente manera:
M = T(-pf) R() T(pf)

donde, p = (x ,y ) es el punto fijo por el que queremos rotar y es el ngulo de rotacin.

Podemos multiplicar todas las matrices para obtener la matriz resultante, M, que es la siguiente:
f

(
cos sen
0 )
M = (
-sen
cos
( (xf - xf cos + yfsen)

0 )
(yf - xfsen - yf cos )

1 )

Ejemplos
Veamos unos ejemplos prcticos.
1.
2.
3.

Tenemos dos puntos, p = (4,2) y q = (-3,1). Queremos rotar estos dos puntos
alrededor del punto (fijo), F = (2,-1), por un ngulo, = /6 (30),
p = p T( (-2,1) ) R(/6) T( (2,-1) )
q = q T( (-2,1) ) R(/6) T( (2,-1) )

Figura 19 - Rotacin de los puntos p y q por el punto F con ngulo

Calculemos la matriz resultante, M,
(
cos /6
M = (
-sen/6
( (2 - 2 cos /6 - sen/6)

sen/6
0 )
cos /6
0 )
(-1 - 2 sen/6 + cos /6) 1 )

Aplicando la matriz resultante, obtenemos el siguiente paso,

p = (

( 0,8660 0,5
4 2 1 ) ( -0,5
0,8660
( -0,2321 -1,1340

( 0,8660
q = ( -3 1 1 ) ( -0,5

0,5
0,8660

0 )
0 )
1 )
0 )
0 )

( -0,2321 -1,1340

1 )

Los resultados son los siguientes,

p = ( 2,2321, 2,5981 )
q = ( -3,3301, -1,7680 )

Figura 20 - Los puntos p y q

4.

5.

Otro ejemplo parecido al anterior es a la hora de agrandar o empequeecer un objeto

el cual est compuesto por varios puntos y lneas. Esto supone un cambiar de escala,
pero como hemos visto anteriormente, esta operacin tambin realiza una traslacin
proporcional a los parmetros del cambio de escala. La solucin es mudar el objeto al
origen, realizar la operacin del cambio de escala, para luego regresar el mismo
objeto a su posicin original. Esto supone que debemos elegir un punto fijo e
invariable para poder trasladar y fijar el objeto al origen. Veamos las operaciones
matriciales bsicas para implementar esta operacin compleja:
M = T(-pf) S(sx,sy) T(pf)

donde, p = (x ,y ) es el punto fijo por el que queremos cambiar el tamao de cualquier

entidad segn los factores indicados por s y s .
Multiplicando todas estas matrices obtenemos la siguiente matriz resultante, M,
f

( sx 0
0 )
M = (
0sy
0 )
( xf(1 - sx) yf(1 - sy)

6.

1 )

Veamos un ejemplo de esta transformacin.

Tenemos un cuadriltero formado por cuatro puntos, p = (4,2), q = (-3,1), r = (-2,2), y s = (3,0). Vamos a agrandar este objeto desproporcionalmente: s = 2 y s = 0,5 y
fijado en el punto, F = (1,2). Algebraicamente, tenemos lo siguiente,
x

p
q
r
s

=
=
=
=

p
q
r
s

T(
T(
T(
T(

(-1,-2)
(-1,-2)
(-1,-2)
(-1,-2)

)
)
)
)

S(2,
S(2,
S(2,
S(2,

0,5)
0,5)
0,5)
0,5)

T(
T(
T(
T(

(1,2)
(1,2)
(1,2)
(1,2)

)
)
)
)

Figura 21 - Agrandamos desproporcionalmente un cuadriltero fijado en F=(1,2)

Calculemos la matriz resultante, M,
( 2
M = ( 0
( -1

0
0,5
1

0 )
0 )
1 )

Ahora multiplicamos cada punto, que describe nuestro objeto, por la matriz
resultante,
4

( 2
1 ) ( 0
( -1

0
0,5
1

0 )
0 )
1 )

q = ( -3

( 2
1 ) ( 0
( -1

0
0,5
1

0 )
0 )
1 )

r = ( -2 -2

( 2
1 ) ( 0
( -1

0
0,5
1

0 )
0 )
1 )

s = (

( 2
1 ) ( 0
( -1

0
0,5
1

0 )
0 )
1 )

p = (

Al final, obtenemos la siguiente informacin,

p
q
r
s

=
=
=
=

( 7, 2 )
( -7, 1,5 )
( -5, 0 )
( 5, 1 )

Figura 22 - El nuevo cuadriltero formado por los puntos p, q, r, y s

Instancia

Otro claro ejemplo del uso de las transformaciones tiene que ver con la creacin de nuevos objetos.
En muchas ocasiones, queremos mostrar varios objetos basados en una misma figura. Sera algo
engorroso describir las coordenadas exactas que describen cada instancia basada en la misma figura.
Por ello, definimos un juego de diferentes objetos para luego crear cada objeto escogido de nuestro
juego, que queremos mostrar en nuestra escena. Usando traslaciones, podemos colocar todas las
instancias de cualesquier objetos en nuestra escena los cuales pueden estar descritos de una sola
manera. Por supuesto, tambin podemos modificar cada instancia antes de colocarla en la escena.
Esto supone aplicar otras transformaciones a nuestros objetos antes de trasladarlos a sus respectivas
posiciones finales.

Ejemplo
Describimos un tringulo, t, con la siguiente lista de vrtices: v = ( (0,0), (1,1), y (2,0) ). Vamos a
crear cuatro tringulos basados en esta descripcin: t , t , t , y t . Sin embargo, aplicaremos varias
transformaciones a cada uno de los tringulos para colocarlos en nuestra escena. Describamos
nuestras intenciones algebraicamente,
0

t0
t1
t2
t3

=
=
=
=

t
t
t
t

S(-1,2) R(/6) T( (3,4) )

R(-/6) Hx(/12) T( (1,-6) )
Hx(/6) Hy(/3) S(0,25, 2) T( (-5,0) )
S(-1,-0,2) T( (-3,-2) )

Figura 23 - El tringulo
original, t
Las matrices resultantes para cada serie de transformaciones son las siguientes:
( -0,8660 -0,5
0 )
M0 = ( -1
1,7321 0 )
( 3
4
1 )
( -1
-0,5
0 )
M1 = ( 3,7321 0,8660 0 )
( 1
-6
1 )
( 0,25
1,1547
M2 = ( 0,4330 4
( -5
0

0 )
0 )
1 )

( -0,125
M3 = ( 0
( -6

0 )
0 )
1 )

0
-0,2
-5

Acabaremos con los siguientes clculos:

t0:v0 = (
t0:v1 = (
t0:v2 = (

0
1
2

0
1
0

1 ) M0
1 ) M0
1 ) M0

t1:v0 = (
t1:v1 = (
t1:v2 = (

0
1
2

0
1
0

1 ) M1
1 ) M1
1 ) M1

t2:v0 = (
t2:v1 = (
t2:v2 = (

0
1
2

0
1
0

1 ) M2
1 ) M2
1 ) M2

t3:v0 = (
t3:v1 = (
t3:v2 = (

0
1
2

0
1
0

1 ) M3
1 ) M3
1 ) M3

Como se puede ver, debemos aplicar las transformaciones a todos los puntos que representan los
vrtices de cada tringulo. Al final, obtendremos la siguiente informacin para los cuatro tringulos:
t0:v0 = (
t0:v1 = (
t0:v2 = (

3 4 1 )
1,1340 5,2321
1,2680 3 1 )

t1:v0 = (
t1:v1 = (
t1:v2 = (

1 -6 1 )
3,7321 -5,634
1 -7 1 )

1 )

1 )

t2:v0 = ( -5 0 1 )
t2:v1 = ( -4,3170 5,1547 1 )
t2:v2 = ( -4,5 2,3094 1 )
t3:v0 = ( -3 -2 1 )
t3:v1 = ( -4 -2,2 1 )
t3:v2 = ( -5 -2 1 )

Figuras 24, 25, 26, y 27 - Los tringulos t , t , t , y t

0

Modelado
^

Hasta ahora hemos visto la aplicacin de las transformaciones afines a puntos. Sin embargo,
nuestras escenas seguramente no se compondrn de puntos individuales, sino de objetos
compuestos de segmentos. Asimismo, estos segmentos se compondrn de puntos. Como no
podemos manipular todos los puntos individualmente en la prctica, s podemos manipular los
puntos finales del segmento. Por lo tanto, describiremos nuestros objetos segn los puntos y los
segmentos conectados entre ellos.
Representacin

Para describir cada objeto, necesitaremos una forma de organizar la informacin: los puntos y
segmentos. Adems, capturaremos la geometra - puntos y segmentos - y la topologa: la asociacin
de los puntos para formar la figura. Si pensamos jerrquicamente, daremos con la idea de
descomponer un objeto geomtrico en otros objetos ms pequeos y fundamentales. Estos objetos
fundamentales pueden ser representados como polgonos. Cada polgono a su vez se forma de
vrtices y aristas. Para describir las aristas de un polgono, crearemos una lista de vrtices. De esta
manera, optimizamos la cantidad de vrtices que usaremos. Como seguramente tendremos
polgonos que coincidan en una o varias aristas de otros polgonos, entonces tambin existirn
vrtices que coinciden. Por ello, es ptimo guardar una copia de cada vrtice y luego referirnos a
cada uno, en lugar de copiarlos. Podemos ver esta estrategia en el siguiente esquema acerca de la
organizacin jerrquica de la informacin que describe un molino.

Figuras 28 y 29 - Molino y Jerarqua

Un matiz importante a notar es el orden de los vrtices para representar cada polgono. Hemos
escogido los vrtices contiguos en el sentido de las agujas del reloj. Esta eleccin se suele llamar
operaciones de mano izquierda, porque podemos usar los cuatro dedos de la mano izquierda para
seguir las aristas de un polgono. Este mtodo tiene que ver con la representacin que hemos hecho
hasta estos momentos al igual que el lgebra matricial usada. Esto tambin tiene importancia
cuando pasemos al modelado en 3D.
Orden de la Representacin

Tenemos dos formas de representar la informacin en las matrices y vectores. Los elementos de cada
fila pueden representar los valores para las coordenadas de los ejes X e Y. Por otro lado, tambin
podramos guardar las coordenadas en las columnas. Esto supondra cambiar el orden de las
multiplicaciones matriciales. Tpicamente, hablamos de operaciones matriciales de fila, con los
elementos en cada fila, y las de columna, donde la informacin se guarda en las columnas.
Dependiendo del tipo de las operaciones matriciales, tambin nos interesa hablar de la manera de
organizar la informacin de nuestros modelos. Geomtricamente, tenemos que elegir los ejes y la
relacin entre ellos. Esta eleccin dictar la colocacin y orientacin de nuestros objetos
geomtricos. Tambin definir el sentido de las rotaciones. Por ello, solemos hablar de la regla de la
mano derecha o de la mano izquierda. Esto hace alusin al uso de una mano u otra para determinar
la relacin entre los ejes y principalmente para las rotaciones. Como en dos dimensiones slo
tenemos dos ejes, no hablaremos de esta regla ya que slo existe una orientacin positiva sobre los
ejes. Volveremos a tratar este concepto cuando veamos el modelado en tres dimensiones.
Hasta ahora y en el resto de este curso, usaremos las operaciones matriciales de fila y la regla de la
mano izquierda.

Vista
^

Despus de todas las transformaciones, que nos interesan aplicar a los objetos en nuestra escena,
tenemos que convertir nuestra escena al medio que queremos. Nuestra escena se compone de los
objetos geomtricos. Sin embargo, la parte que queremos ver - la vista - se basa en un rea que
envuelve estos objetos geomtricos de la escena. Tpicamente, querremos mostrar la vista, como un
rea rectangular, en toda la pantalla, en pxeles. Por supuesto, existirn ocasiones en las que
elegiremos una parte de la pantalla que contendr nuestra vista. El paso de nuestro mundo o
universo en 2D a la pantalla en 2D no es uno complicado, pero s es necesario.
Podemos afrontar este problema como un cambio de representacin. Tenemos el marco de
referencia de nuestro universo descrito como \ y queremos representar los objetos geomtricos en
nuestra escena en el marco de referencia de la pantalla descrito como \. Las siguientes ecuaciones
describen el marco de referencia de la pantalla en trminos del marco de nuestro universo,
ux = sxvx
uy = -syvy
Q0 = qxvx + qyvy

donde,
s es el factor para el cambio de escala en el eje X; es decir, la proporcin de anchuras de la escena y
de
la
pantalla:
d /d
s es el factor para el cambio de escala en el eje Y; es decir, la proporcin de anchuras de la escena y
de
la
pantalla:
d /d
(q ,q ) es el punto en la esquina superior izquierda que encuaderna nuestra escena. Este punto
representar el origen en la pantalla.
x

Figuras 30 y 31 - Marcos de referencia de nuestra escena y de la pantalla

La matriz de representacin es la siguiente,
( sx 0 0 )
M = ( 0 -sy 0 )
( qxqy 1 )

Como queremos cambiar la representacin, necesitaremos determinar la inversa de M, que es,

( 1/sx 0
0 )
M-1 = ( 0
-1/sy 0 )
( -qx/sxqy/sy 1 )

Ejemplo
Tenemos dos tringulos, s y t, en nuestra escena. El marco de referencia que representa nuestro
universo es el siguiente: \. La vista de nuestra escena ser representada por el cuadrado cuya
esquina superior izquierda es (-3,2) y cuyo lado mide 8. La siguiente figura 32 muestra nuestra
escena y las dimensiones de nuestra vista en el marco de referencia del universo.

Figura 32 - Escena con dos tringulos y la vista de

nuestra escena
Queremos representar estos dos tringulos en la pantalla cuya resolucin es 400 x 400. Las
siguientes ecuaciones describen el marco de referencia de la pantalla en trminos del marco de
nuestro universo,
400 ux = 8 i
400 uy = -8 j
Q0 = -3 i + 2 j

Simplificando, terminamos con,

ux = 0,02 i
uy = -0,02 j
Q0 = -3 i + 2 j

Obtenemos la siguiente matriz de representacin,

( 0,02 0
M = ( 0
-0,02
( -3
2

0 )
0 )
1 )

Para poder cambiar la representacin, necesitamos calcular la inversa de la matriz, M, que es,
( 50
M-1 = ( 0
( 150

0
0 )
-50 0 )
100 1 )

Podemos ver el resultado del cambio de representacin de los vrtices de ambos tringulos en la
figura 33.

Figura 33 - Escena con dos tringulos en pantalla en

pxeles
Otra forma de resolver el problema de conversin es aplicar una transformacin compuesta de una
traslacin seguida de un cambio de escala. Trasladamos el punto en la esquina superior izquierda
que de nuestra vista al origen. Luego, cambiamos de escala y con reflejo. Los factores de tal cambio
de escala se basan en las proporciones de la anchura de la pantalla con respecto a la anchura de la

vista para el eje X, y las proporciones de la altura de la pantalla con respecto a la altura de la vista
para el eje Y. En forma matricial, tenemos la siguiente transformacin afn,
M = T(-qx,-qy) S(sx,-sy)

donde,
s es la proporcin de las anchuras de la pantalla y de la escena: d /d
s es la proporcin de las alturas de la pantalla y de la escena: d /d
(q ,q ) es el punto que representar el origen en la pantalla de la esquina superior izquierda del
rectngulo que encuaderna nuestra escena.
x

Usando el ejemplo anterior, obtendramos la siguiente matriz,

M = T(3,-2) S(400/8,-400/8)

Al final, conseguimos la misma matriz que la solucin obtenida previamente al realizar un cambio de
marco de referencia,
( 50
M-1 = ( 0
( 150

0
0 )
-50 0 )
100 1 )

Apuntes de Grficos
Transformaciones 2D
Concepto

Traslacin

Operacin

Escala

Transformaciones
proyectivas

Rotacin

Cizalla

Reflexin

Transformaciones afines

Proyeccion
es

Sistemas
de
coordenada
s

Concepto

1. Transformacin de un punto en otro mediante algoritmo o

frmula
2. Se usarn en representacin 2D y 3D
3. Usamos vectores fila

(x,y,w)

Modo de operacin

1. Se da un rodeo a la transformacin directa en el plano

cartesiano
ej:

(3,2) -> (2,4)

1. Paso de puntos afines a puntos en coordenadas homogneas

ej:

(3,2) -> (3,2,1)

2. Transformaciones en Pn (traslacin, rotacin, escala, ...)

ej:

(3,2,1) -> (4,8,2)

3. Paso de puntos en coordenadas homogneas a puntos afines

ej: (4,8,2) -> (2,4)
No se puede realizar para puntos impropios
2. Serie de transformaciones se reducir a producto
por una matriz
Transformaciones proyectivas en P2

1. Forma general:
2. Lneas rectas se transforman en lneas rectas
3. Se mantienen los puntos de interseccin
1. Punto interseccin de rectas transformadas es transformado de
punto interseccin
4. Secciones cnicas se mantienen como tales
Transformaciones afines en P2

1. Forma general:

y siendo invertible

2. Puntos propios se mantienen como propios y los impropios se

mantienen como impropios
1. No se traen ni se llevan puntos al infinito
2. Rectas paralelas siguen siendo paralelas
3. Cambio de sistema de referencia
Traslacin

1. Vector de traslacin

2. Transformacin:

3. Paso a coordenadas homogneas

4. Matriz de transformacin:

5. Transformacin inversa (traslacin

):

Escala centrada en el origen

1. Transformacin:
2. Paso a coordenadas homogneas

3. Matriz de transformacin:

4. Matriz de transformacin inversa:

Rotacin respecto del origen (ngulo

1. Coordenadas polares

2. Transformacin:

3. Matriz de transformacin:

4. Matriz de transformacin inversa (rotacin de ngulo

):

5. Transformacin de dos rotaciones es rotacin de suma de

ngulos
Rotacin respecto de cualquier punto

1. Supongamos centro en

(xc,yc)

y ngulo

1. Trasladamos centro al origen

2. Rotamos

3. Hacemos traslacin inversa para dejar centro en posicin

original

2. Transformacin final
3. Transformacin inversa

Cizalla (shearing)

1. Transformacin:
2. Matriz de transformacin:

3. Matriz de transformacin inversa:

Reflexin respecto del eje X

1. Transformacin:
2. Matriz de transformacin:

3. Las reflexiones son inversas de s mismas

4. Recta de puntos fijos (eje de reflexin)
Reflexin respecto de una recta que pasa por el origen

1. Supongamos que la recta forma un ngulo

1. Llevamos recta al eje X (rotacin)

2. Reflejamos

3. Llevamos recta a su posicin original

2. Transformacin final

3. Comprobacin
Reflexin respecto de cualquier recta

1. Supongamos recta de la forma:

2. Transformacin final

y=mx+b

con el eje X:

Reflexin respecto de un punto

1. Reflexin respecto del origen

2. Reflexin respecto de cualquier punto

Proyeccin ortogonal (paralela) sobre eje X

1. Transformacin

2. Propiedades
1. Proyeccin no tiene inversa
2. No est definida para todos los puntos (ej:

(0,1,0))

3. Hay recta de puntos fijos (eje sobre el que se proyecta)

Proyeccin oblicua (paralela) sobre eje X

1. Segn recta de pendiente

2. Matriz de transformacin

Proyeccin perspectiva (no paralela) sobre eje X

1. Centro de proyeccin

(xc,yc,1)

2. Matriz de transformacin para cualquier centro

3. Proyeccin oblicua es un caso particular:

(xc,yc,wc):

(xc,yc,wc)=(1,m,0)

Proyeccin perspectiva (no paralela) sobre cualquier recta

1. Centro de proyeccin

(xc,yc,wc)

y recta

y=mx+b

2. Transformacin
Traslacin y rotacin vistas ms arriba
3. OJO! P'w es la matriz de proyeccin para el centro de
proyeccin transformado:

Cambio de sistemas de coordenadas

1. Hacer una operacin sobre los ejes coordenadas (trasladar,

rotar, ...) equivale a hacer operacin inversa sobre los puntos
del espacio
2. Cambio a sistema de coordenadas con origen en
cuyos ejes forman un ngulo con los antiguos

(x0,y0,1)y

1. Trasladamos origen al nuevo punto

(, lo que es lo mismo, trasladamos puntos de forma que el
punto correspondiente al nuevo origen vaya a parar al origen de
coordenadas antiguo)

2. Rotamos los ejes a su nueva posicin

(, lo que es lo mismo, rotamos los puntos de forma que la recta
correspondiente al nuevo eje X vaya a parar al eje X antiguo)

3. Matriz de cambio de coordenadas

http://arantxa.ii.uam.es/~pedro/graficos/practicas/GRAF_2011-2012/hojas/hoja-03.htm