31
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 - Marcio Bueno · 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

Embed Size (px)

Citation preview

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