Transformações 2D
Fonte: Material do Prof. Robson Pequeno
de Sousa e do Prof. Robson Lins
Prof. Márcio Bueno
{cgtarde,cgnoite}@marciobueno.com
Transformações 2D
2/31
Transformações Geométricas são a base de inúmeras
aplicações gráficas
O que são elas?
São usadas para mostrar ou representar objetos gráficos
Matemática: Mapeamento entre valores (função/relação)
Geométrica: translação, rotação, escala, cizalhamento,…
Porque são importantes em computação gráfica?
Move o objeto na tela / no espaço
Mapeamento do modelo no espaço para a tela.
Computação Gráfica - Márcio Bueno
Transformações 2D
3/31
Exemplos de aplicações de transformações geométricas: Programa para representar layouts de circuitos eletrônicos.
Programas de planejamento de cidades
Movimentos de translação para colocar os símbolos que definem edifícios e árvores em seus devidos lugares, rotações para orientar corretamente esses símbolos, e alteração de escala para adequar o tamanho desses símbolos, etc.
sistemas de software sofisticados que permitem a construção de cenas realistas.
Computação Gráfica - Márcio Bueno
Transformações Geométricas 2D
Computação Gráfica - Márcio Bueno4/31
Transformações básicas
Translação (Translation) (T)
Escala (scaling) (S)
Rotação (rotation) (R)
Outras Transformações
Reflexão (reflection)
Cizalhamento (shear)
Computação Gráfica - Márcio Bueno5/31
Deslocamento do objeto no espaço
xnew = xold + tx ynew = yold + ty
Translação
ty
tx
6/31
Mudança de Escala
O uso clássico desta operação em computação gráfica é
a função zoom in (ampliação) ou zoom out (redução)
xnew = sxxold ynew = syyold
wold wnew
hold
hnew
Computação Gráfica - Márcio Bueno
Escala
7/31
A rotação é o giro de um
determinado ângulo de um ponto
em torno de um ponto de
referência, sem alteração da
distância entre eles.
Queremos girar (x1,y1) para o
ponto (x2,y2) pelo ângulo B
Da figura temos:
sen (A + B) = y2/r cos (A + B) = x2/r
sen A = y1/r cos A = x1/rA
B
Computação Gráfica - Márcio Bueno
Rotação em Torno da Origem
r
(x2,y2)
(x1,y1)
x
y
(0,0)
8/31
Sabemos que: sin (A + B) = sinAcosB + cosAsinB
Substituindo,
y2/r = (y1/r)cosB + (x1/r)sinB
multiplicando por r, tem-se que:
y2 = y1cosB + x1sinB
Por fim:x2 = x1cosB - y1sinB
y2 = x1sinB + y1cosB
Computação Gráfica - Márcio Bueno
Rotação em Torno da Origem
9/31
Translação: xnew = xold + tx
ynew = yold + ty
Escala: xnew = sxxold
ynew = syyold
x xnew
y ynew
t x tx x
t y ty y
y
x
s
s
ys
xs
y
x
y
x
y
x
new
new
0
0
Computação Gráfica - Márcio Bueno
Transformações como Matrizes
10/31
Rotação:
x2 = x1cos - y1sen
y2 = x1sen + y1cos
)cos()(
)()cos(
11
11
2
2
ByBsenx
BsenyBx
y
x
1
1
)cos( )(
)( )cos(
y
x
BBsen
BsenB
Computação Gráfica - Márcio Bueno
Transformações como Matrizes
Coordenadas Homogêneas
Computação Gráfica - Márcio Bueno11/31
Infelizmente, a translação é tratada de forma diferente (como
uma soma) das outras - Rotação e Escala são tratadas através
de multiplicações.
P' = T + P
P' = S · P
P' = R · P
Para que possamos combinar facilmente essas transformações,
devemos tratar do mesmo modo todas as 3 transformações.
Se os pontos são expressos em Coordenadas
Homogêneas, todas as 3 transformações podem ser tratadas
como multiplicações.
12/31
As coordenadas homogêneas de um ponto (x,y) são
(x’, y’, w), em que x = x’/w, y = y’/w e w é qualquer número
real diferente de 0
Um conjunto de coordenadas homogêneas é sempre da forma
(x, y,1)
Essa forma representa o ponto (x,y)
Todas as outras coordenadas homogêneas são da forma
(wx,wy,w)
Note que a representação em coordenadas homogêneas não é
única
Por exemplo: (6,4,2), (12,8,4), (3,2,1) representam o ponto
(3,2)
Computação Gráfica - Márcio Bueno
Coordenadas Homogêneas
Coordenadas Homogêneas
Computação Gráfica - Márcio Bueno13/31
Interpretação geométrica Os pontos em coordenadas homogêneas formam o
plano definido pela equação w=1 no espaço (x,y,w)
Transformações e Coordenadas
Homogêneas
Computação Gráfica - Márcio Bueno14/31
Assim, as transformações de um ponto em coordenashomogêneas podem ser tratadas como multiplicações
1
),( y
x
P yx
. .
.
.
T P Transl
P S P Escala
R P Rotaçao
15/31
100
0cossin
0sincos
R
100
00
00
, y
x
yx s
s
S
100
10
01
, y
x
yx t
t
T
Computação Gráfica - Márcio Bueno
Transformações e Coordenadas
Homogêneas
16/31
Suponha que queremos realizar multiplas transformações
sobre um ponto:P2 T3,1P1
P3 S2, 2P2
P4 R30P3
M R30S2,2T3,1
P4 MP1Lembrando:
Multiplicação de matrizes é associativa, não comutativa!
Matrizes de transformação podem ser pre-multiplicadas
Computação Gráfica - Márcio Bueno
Transformações Compostas
Transformações Compostas - Mudança
de Escala
Computação Gráfica - Márcio Bueno17/31
Dada três transformações básicas podemos criar outras
transformações.
Mudança de escala com ponto fixo
Um problema com a mudança de escala é que ela move o
objeto que teve a escala alterada.
Mudança de escala na linha (2, 1) a (4,1) para duas vezes seu
comprimento.
0 1 2 3 4 5 6 7 8 9 10
Antes Apos
0 1 2 3 4 5 6 7 8 9 10
18/31
Se mudamos a escala da linha entre (0,0) e (2,0)
por duas vezes, o ponto (0,0) não move.
(0,0) é denominado ponto fixo para a transformação mudança de
escala básica. Podemos utilizar transf. Composta para criar transf.
mudança de escala com pontos fixos diferentes da origem.
0 1 2 3 4 5 6 7 8 9 10
antes depois
0 1 2 3 4 5 6 7 8 9 10
Computação Gráfica - Márcio Bueno
Transformações Compostas - Mudança
de Escala
19/31
Escala por 2 com ponto fixo = (2,1)
Translade o ponto (2,1) para a origem
Escale por 2
Translade a origem para (2,1)
0 1 2 3 4 5 6 7 8 9 10
antes
Computação Gráfica - Márcio Bueno
Mudança de Escala - Ponto Fixo
Mudança de Escala - Ponto Fixo
20/31
CTST
100
010
202
100
110
201
100
010
002
100
110
201
1,21,21,2
2 0 2
0 1 0
0 0 1
C
2
1
1
2
1
1
1
1
6
1
1
4
100
010
202
C
0 1 2 3 4 5 6 7 8 9 10
apos
0 1 2 3 4 5 6 7 8 9 10
antes
coord (2,1) coord (6,1)
Computação Gráfica - Márcio Bueno
21/31
Rotação de graus em torno de (x,y)
Translade (x,y) para origem
Faça a Rotação
Translade a origem para (x,y)
, ,
1 0 cos s n 0 1 0
0 1 s n cos 0 0 1
0 0 1 0 0 1 0 0 1
x y x y
x e x
C y e y
T R T
Computação Gráfica - Márcio Bueno
Rotação em Torno de Ponto Fixo
22/31
(x,y) (x,y)
Posição inicial e final
Computação Gráfica - Márcio Bueno
Rotação em Torno de Ponto Fixo
23/31
Dado original y cisalh. x cisalh.
100
01
001
a
100
010
01 b
Matriz de cisalhamento em y Matriz de cisalhamento em x
Computação Gráfica - Márcio Bueno
Cisalhamento
24/31
Reflexão em torno do eixo y Reflexão em torno do eixo x
100
010
001
100
010
001
Computação Gráfica - Márcio Bueno
Reflexão - Espelhamento
25/31
Reflexão de um objeto em relação a um eixo
perpendicular ao plano xy e passando na origem
100
010
001
Computação Gráfica - Márcio Bueno
Mais Reflexões
26/31
Casos especiais em que a comutatividade de
composição de transformações são validas.
Computação Gráfica - Márcio Bueno
Transformações Compostas
Transformação Janela em Porta de Visão
(Windows to Viewport)
27/31
Como as primitivas são especificadas em coordenadas
do mundo, o pacote gráfico precisa mapear as
coordenadas do mundo em coordenadas de tela.
Uma forma de se efetuar esta transformação é
especificando uma região retangular em coordenadas
do mundo.
Uma região retangular correspondente em
coordenadas de tela, chamada de Porta de Visão
(Viewport).
Computação Gráfica - Márcio Bueno
Transformação Janela em Porta de Visão
(Windows to Viewport)
28/31
Alguns sistemas gráficos permitem ao programador
especificar primitivas de saída em um sistema de
coordenadas em ponto-flutuante.
Chamado de sistema de coordenadas do Mundo Real.
O termo Mundo (World) é usado para representar o
ambiente interativamente criado ou apresentado para
o usuário.
Computação Gráfica - Márcio Bueno
Transformação Janela em Porta de Visão
(Windows to Viewport)
29/31
A transformação que mapeia a janela na porta de
visão é aplicada a todas as primitivas de saída em
coordenadas do mundo, mapeando-as na tela.
Porta de visão Duas Portas de visão
Computação Gráfica - Márcio Bueno
Transformação Janela em Porta de Visão
(Windows to Viewport)
30/31
Dada uma janela e uma porta de visão, qual é a matriz
de transformação que mapeia a janela em
coordenadas do mundo real, na porta de visão em
coordenadas de tela?
Computação Gráfica - Márcio Bueno
Transformação Janela em Porta de Visão
(Windows to Viewport)
31/31
max min max min
max min max min min min( , ). ( , ). ( , )u u v v
m m x x y yMjp T u v S T x y
max minmax min
max minmax min
1 0 min 0 0 1 0 min
0 1 min . 0 0 . 0 1 min
0 0 1 0 0 1 0 0 1
u ux x
v vy y
u x
v y
Alguns pacotes gráficos combinam a transformação janela - porta
de visão com recorte (clipping) de primitivas gráficas de saída.
Computação Gráfica - Márcio Bueno
Top Related