TRANSFORMAÇÕES
1
Transformações 2D
Translação e Geometria Afim (2D)
Referências Bibliográficas
2
TRANSFORMAÇÕES 2D
Vamos estudar algumas transformações 2D (lineares) na
geometria euclidiana, em particular, as transformações de:
Escala
Reflexão
Cisalhamento
Rotação
.: Note a ausência da transformação de translação, por
enquanto
3 . 1
ESCALA
Altera as dimensões de um objeto nos eixos cartesianos
Deforma o objeto se as escalas forem diferentes em
cada eixo
0
S(Sx , Sy ) = [ ]
Sx
0 Sy
Portanto,
0 x
[ ][ ] = [ ]
Sx Sx x
0 Sy y Sy y
3 . 2
ESCALA - EXEMPLO
0.5 0
[ ]
0 0.5
0.5 0
[ ]
0 1.5
3 . 3
REFLEXÃO
Transformação de escala com um fator negativo
1 0 −1 0
Ref lX = [ ]; Ref lY = [ ]
0 −1 0 1
Note que os dois fatores negativos, simultaneamente, faz
uma rotação de 180º
3 . 4
EXEMPLO - REFLEXÃO
Reflexão em X
Reflexão em Y
3 . 5
CISALHAMENTO (SHEARING)
Do dicionário priberam:
Deformação de um corpo com
deslocamento em planos diferentes,
mantendo o volume constante.
Formato:
1 1 0
Shx (s) = [ ]; Shy (s) = [ ]
s
0 1 s 1
3 . 6
EXEMPLO - CISALHAMENTO
Cisalhamento em Y
Cisalhamento em X
3 . 7
CISALHAMENTO - NOTAÇÃO
ANGULAR
x′ 1 x + s.y
[ ′] = [ ][ ] = [ ]
s x
y 0 1 y y
3 . 8
CISALHAMENTO - NOTAÇÃO
ANGULAR
x′ 1 x + s.y
[ ′] = [ ][ ] = [ ]
s x
y 0 1 y y
x′ − x s.y
cot(θ) = = =s
y y
1 cot(θ)
∴ Shx (θ) = [ ]
0 1
3 . 8
ROTAÇÃO
Rotacionar a para b → comprimento constante (r )
Relações:
3 . 9
ROTAÇÃO
Rotacionar a para b → comprimento constante (r )
Relações:
{
xa = r cos(α)
ya = r sin(α)
{
xb = r cos(α + ϕ)
yb = r sin(α + ϕ)
3 . 9
ROTAÇÃO (2)
{
xb = r cos(α + ϕ)
yb = r sin(α + ϕ)
{
xb = r cos(α) cos(ϕ) − r sin(α) sin(ϕ)
yb = r sin(α) cos(ϕ) + r cos(α) sin(ϕ)
{
xb = xa cos(ϕ) − ya sin(ϕ)
yb = ya cos(ϕ) + xa sin(ϕ)
3 . 10
ROTAÇÃO - MATRIZ
cos(ϕ) − sin(ϕ) xa
[ ]=[ ][ ]
xb
yb sin(ϕ) cos(ϕ) ya
Ou seja, matriz de rotação:
cos(ϕ) − sin(ϕ)
R(ϕ) = [ ]
sin(ϕ) cos(ϕ)
Note que é uma matriz ortonormal
3 . 11
ROTAÇÃO - EXEMPLO
Rotação de 45º Rotação de -30º
3 . 12
EXERCÍCIOS
Considere uma geometria definida pela primitiva
TRIÂNGULO e pelos pontos de controle:
{P2 = [2, 0];
P1 = [0, 0];
P3 = [1, 1];
1. Desenhe esse triângulo num papel;
2. Aplique uma escala que dobre o tamanho do triângulo.
Desenhe;
3. Aplique um cisalhamento em X de 60º. Desenhe;
4. Rotacione de 30º e 90º. Desenhe;
3 . 13
COMPOSIÇÃO DE
TRANSFORMAÇÕES
Usual é o objeto receber mais do que uma transformação
Exemplo: aplica-se uma escala (S ) a um vetor v e, em
seguida, uma rotação (R), qual o valor de v ′ ?
vx = S.v e v ′ = [Link]
∴ v ′ = R(S.v ) = (R.S)v
ou seja, v ′ = M v com M = R.S
3 . 14
ORDEM DAS MATRIZES
Note: M = RS deve ser lida da direita para a esquerda
Primeira transformação → S. Posteriormente → R
Ordem é importante → RS=SR /
Ex.: Reduzir pela metade a altura e rotacionar de 45º
3 . 15
ORDEM DAS MATRIZES
Note: M = RS deve ser lida da direita para a esquerda
Primeira transformação → S. Posteriormente → R
Ordem é importante → RS=SR /
Ex.: Reduzir pela metade a altura e rotacionar de 45º
2 2 2 2
[ ] [0 ] =[ ]
2
− 2
1 0 2
− 4
[ ] 2 2 0.5 2 2
2 2 2 4
2 2 2 2
[ ][ ]=[ ]
1 0 2
− 2 2
− 2
[ ]
0 0.5 2
2
2
2
4
2
4
2
3 . 15
ORDEM DAS MATRIZES
Note: M = RS deve ser lida da direita para a esquerda
Primeira transformação → S. Posteriormente → R
Ordem é importante → RS=SR /
Ex.: Reduzir pela metade a altura e rotacionar de 45º
2 2 2 2
[ ] [0 ] =[ ]
2
− 2
1 0 2
− 4
[ ✓] 2 2 0.5 2 2
2 2 2 4
2 2 2 2
[ ][ ]=[ ]
1 0 2
− 2 2
− 2
[ ]
0 0.5 2
2
2
2
4
2
4
2
3 . 15
GRAFICAMENTE
M = RS M ′ = SR
3 . 16
CURIOSIDADE
O cisalhamento pode ser
decomposto em uma
transformação do tipo:
R1 .S.R2T
3 . 17
TRANSLAÇÃO E
GEOMETRIA AFIM (2D)
Translação é definida por:
p′ = p + t
⎡ ⎤ ⎡x + tx ⎤ ⎡1 tx ⎤ ⎡x⎤
′
x 0
y ′ = y + ty = 0 1
⎣ 1 ⎦ ⎣ 1 ⎦ ⎣0 1 ⎦ ⎣1⎦
ty y
0
4 . 1
TRANSLAÇÃO
Dado um vetor t = [tx , ty ], a transformação de translação
é definida por:
⎡1 0 tx ⎤
T (tx , ty ) = 0 1
⎣0 1⎦
ty
0
4 . 2
ESCALA, CISALHAMENTO E ROTAÇÃO
0 0 1 cot(θ) 0
S(Sx , Sy ) = [ 0 0] Shx (θ) = [0 0]
Sx
Sy 1
0 0 1 0 0 1
cos(θ) − sin(θ) 0
R(θ) = [ sin(θ) cos(θ) 0]
0 0 1
4 . 3
ANATOMIA DE UMA
TRANSFORMAÇÃO
Note que a transformação afim:
a b tx 1 0 tx a b 0
[c d ty ] = [0 1 ty ] [ c d 0] = T .M
0 0 1 0 0 1 0 0 1
Onde, T é a transformação de translação e M é uma
composição das transformações anteriores (rotação e/ou
escala)
4 . 4
EXEMPLO - TRANSFORMAÇÃO DE
JANELAS
Qual a matriz que permite transforma o retângulo
[xl , yl ] × [xh , yh ] no retângulo [x′l , yl′ ] × [x′h , yh′ ]?
4 . 5
SOLUÇÃO DO EXEMPLO
Transladar ponto [xl , yl ] → origem
Escalonar
Transladar para o ponto [x′l , yl′ ]
′ ′ ′ ′
x − x y − y
M = T (x′l , yl′ ).S( h l
, h l
).T (−xl , −yl )
xh − xl yh − yl
⎡ xh −xl ⎤
x′h −x′l x′l xh −x′h xl
0
M =⎢ 0 ⎥
xh −xl
yh′ −yl′ yl yh −yh′ yl
′
⎣ 0 ⎦
yh −yl yh −yl
0 1
4 . 6
SOBRE MODELAGEM DE OBJETOS
Pivô → eixo de rotação de um objeto
Normalmente é o centro de massa
Note que em nossas transformações → origem do centro
de coordenadas não recebe transformações
Pivô de um objeto deve estar no centro de
coordenadas
4 . 7
TRANSFORMAÇÕES IN LOCO
Para aplicar uma transformação no pivô do objeto,
quando esta não se encontra na origem do sistema
coordenado:
Transladar o pivô para a origem do sistema
coordenado
Aplicar transformação
Transladar de volta o objeto para a posição inicial
M ′ = T .M .T −1
4 . 8
INVERSAS DAS TRANSFORMAÇÕES
Translação:
T −1 (tx , ty ) = T (−tx , −ty )
Escala:
S −1 (sx , sy ) = S( s1x , s1y )
Rotação:
R−1 (θ) = RT (θ) = R(−θ)
4 . 9
EXEMPLO
Considere o seguinte triângulo:
⎧
⎪P0 = [1, 1]
⎨P1 = [3, 1]
⎪
⎩
P3 = [2, 2.5]
Qual a matriz de rotação que permite rotacioná-lo de 30º
em torno do ponto médio?
4 . 10
SOLUÇÃO DO EXEMPLO
Ponto médio: P = [ 1+3+2
3 , 1+1+2.5
3 ] = [2, 1.5]
M = T (2, 1.5).R(30º).T (−2, −1.5)
⎡ 23 −0.5 2.75 − 3 ⎤
M = ⎢0.5 3
0.5 − 0.75 3⎥
⎣0 ⎦
2
0 1
4 . 11
REFERÊNCIAS
BIBLIOGRÁFICAS
Marschner, Shirley; Fundamentals of Computer Graphics,
4º Edition, CRC Press, 2016
Ganovelli, Corsini, Pattanaik & Benedetto; Introduction to
Computer Graphics: A Pratical Learning Approach; CRC
Press; 2015
Hearn, Baker & Crithers; Computer Graphics with
OpenGL; Pearson; 2014
Fontes consultadas pelo site [Link]
5
// [Link] plugins