Transformações Gráficas Bidimensionais...

Transformações Gráficas

Bidimensionais (2D)Bidimensionais (2D)

Antonio L. BajuelosDepartamento de Matemática

Universidade de Aveiro

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionaisIntroduçãoIntrodução

Um sistema gráfico que permita ao utilizador definirobjectos deve incluir a capacidade de simular o movimento ea manipulação de objectos segundo determinadas regras.

� Exemplo:� Deve ser capaz deampliar o objecto de modo a tornar claro alguns

detalhes ou;� Reduzi-lo demodoapermitir asuacompletavisualizaçãoou;

2

� Reduzi-lo demodoapermitir asuacompletavisualizaçãoou;� Desloca-lode um ponto para outro. etc.

� Transformações Geométricas (TG) são a base deinúmeras aplicações gráficas.� Exemplos:

� para representarlayoutsde circuitos electrónicos;� em programas de planeamento de cidades;� em sistemas desoftwaresofisticados que permitem a construção

de cenas realistas.

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionaisIntroduçãoIntrodução� Neste capítulo abordaremos as:

� Transformações primárias:�� TranslaçãoTranslação�� RotaçãoRotação�� VariaçãoVariação dede EscalaEscala ((ScalingScaling))

3

� Transformações secundárias:�� ReflexãoReflexão�� DistorçãoDistorção ((ShearingShearing))

� Combinaçãode Transformações

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionaisIntroduçãoIntrodução� Consideremos umsistema coordenado numplanoxOy

� Um objectoObj no plano pode ser considerado como umconjunto de pontos.

� Cada pontoP ∈∈∈∈ Obj pode ser definido comoP(x, y)

� Então

4

� Então

� Obj = ∪∪∪∪ Pi(xi, yi), Pi ∈∈∈∈ Obj� SeObj é movido para uma nova posição ele pode ser considerado

como um novo objectoObj no qual todos os pontosP´ podem serobtidos a partir dos pontos originaisP, através da aplicação de umatransformação geométrica.

� Transformações primárias:TranslaçãoTranslaçãoTranslação: Um objecto édeslocado uma dada distância,segundo uma dada direcção, emrelação à sua posiçãooriginal.� Assim, cada pontoP(x,y) pode ser movido pordx unidades em

relação ao eixox, e pordyunidades em relação ao eixoy

� Logo,o pontoP'(x',y‘) , podeserescritocomo:

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais

� Logo,o pontoP'(x',y‘) , podeserescritocomo:

x'= x + dx e y' = y + dy (1)

� E se definimos os vectores colunas:

� Então(1) pode ser expressa como:

P' = P + T

5

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações primárias:TranslaçãoTranslação (cont(cont……))

� Exemplo: Translação de um objecto por(3, -4)

6

� Atenção:� Podemos trasladar um objecto, fazendo-o a todos os seus pontos

trasladar (o que não é muito eficiente!)� Para transladar uma linha podemos fazê-lo apenas para seus

pontos limites e sobre estes pontos redesenhar a linha.� Isso também é válido paravariações de EscalaeRotações

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações primárias:RotaçãoRotação

Rotação:Mudança de posição de uma entidade geométricanumplano, por forma a que todos os seus pontos descrevamarcos de circunferência coma mesma amplitude econcêntricas� Exemplo: Rotação de um objecto por 45º (em relação a origem)

7

� Atenção:� Osângulos positivossão definidos quando a rotação é feita no sentido

contrário aos do ponteiro do relógio (CCW).� Osângulos negativosquando a rotação é feita no sentido dos ponteiros

do relógio (CW).

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações primárias:RotaçãoRotação (cont(cont……))

� A rotação de pontos através de umânguloθ é definidapor:

x' = x · cos(θθθθ ) – y · sin(θθθθ )

y' = x · sin(θθθθ ) + y · cos(θθθθ )� ematricialmente:

8

� ematricialmente:

� R– matriz da rotação


� Lembremos que:sin(-θθθθ ) = -sin(θθθθ ) ee quequecos(-θθθθ ) = cos(θθθθ )

� Observemos a seguinte figura que a rotação porθ transformaP(x,y)emP´(x´,y )

�� Assim temos que:

x = r · cos(φφφφ ), y = r · sin(φφφφ ) (1)x´ = r · cos(θθθθ +φφφφ ) == r · cos(φφφφ ) · cos(θθθθ ) - r · sin(φφφφ ) · sin(θθθθ ) (2)

9

= r · cos(φφφφ ) · cos(θθθθ ) - r · sin(φφφφ ) · sin(θθθθ )y´ = r · sin(θθθθ +φφφφ ) == r · cos(φφφφ ) · sin(θθθθ ) + r · sin(φφφφ ) · cos(θθθθ )

� Podemos obter a equação:

x' = x · cos(θθθθ ) – y · sin(θθθθ )y' = x · sin(θθθθ ) + y · cos(θθθθ )

substituindo a equação((11))na equação((22))

(2)


� É de notar que as fórmulas de transformação apresentadas em:

x' = x · cos(θθθθ ) – y · sin(θθθθ )

y' = x · sin(θθθθ ) + y · cos(θθθθ )são independentes do raio r do arco da circunferência e doângulo inicial φφφφ

� Estes valores só foram introduzidos para podermosdeduzir as

10

� Estes valores só foram introduzidos para podermosdeduzir asfórmulas de transformação para rotação de um ponto em torno daorigem do sistema de eixos coordenados.

� É fácil obter que no caso da rotação de um ponto em torno de umponto pivot(x(xpp,, yypp)) e equação da rotação ficaria como:

x' = (x - xp ) · cos(θθθθ ) – (y – yp ) · sin(θθθθ ) + xp

y' = (x - xp ) · sin(θθθθ ) + (y – yp ) · cos(θθθθ ) + yp

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações primárias:RotaçãoRotação (cont(cont......))

� Exercício:

Aplique uma rotação de 45º ao triângulo A(0,0),B(1,1), C(5,2):

(a) Em torno da origem

(b) Em torno de P(-1, -1)

11

Atenção:

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações primárias:VariaçãoVariação dede EscalaEscala

Variação de Escala:É o processo que permite a expansãoou a compressão das dimensões de umobjecto.� Geralmente são utilizadas constantes positivas de variação de escala

sx e sy para descrever variações de comprimento em relação àdirecçãox e a direcçãoy, respectivamente.

� Uma constante de variação de escala:> 1 indica uma expansão

12

� > 1 indica uma expansão� < 1 indica uma compressão

� A transformação de variação de escala é dada por:

x' = sx · x , y' = sy · you em forma matricial

� S– matriz da variação de escala

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações primárias:VariaçãoVariação dede EscalaEscala (cont(cont......))

Exemplo: Na figura a seguir a casa sofre uma escala de½ em x e de¼emy.

13

� Observe que:� a variação de escala é feita em relação a origem. Assim a “casa” fica

menor e mais próxima da origem.� as proporções da casa são alteradas, isto é, uma escala em quesx é

diferente desy

� Se são utilizadas escalas uniformes (sx = sy) as proporções nãosão afectadas.

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações primárias:VariaçãoVariação dede EscalaEscala (cont(cont......))

� Exercícios:1. Determine a forma geral da matriz de variação de

escalaM(Sx,Sy,P)emrelação a umponto fixoP(h, k).Sugestão:utilizar a representaçãov = - hI - kJ

2. Amplie o tamanhodo triângulo com os vértices

14

2. Amplie o tamanhodo triângulo com os vérticesA(0,0), B(1,1) e C(5,2) para o dobro, mantendo oponto C(5,2) fixo.Sugestão:utilizar os resultados do exercício anterior

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:ReflexãoReflexão

Reflexão:A transformação de reflexão, ouespelhamento,aplicada a umobjecto, produz umobjecto que é oespelhodo original.

� No caso de uma reflexão2D, pode-se considerar a�� ReflexãoReflexão ememrelaçãorelação aa umum pontoponto�� ReflexãoReflexãoememrelaçãorelaçãoaaumauma rectarecta

15

ReflexãoReflexãoememrelaçãorelaçãoaaumauma rectarecta� Em ambos casos a transformação pode ser obtida através de

uma rotação de 180ºem torno do ponto ou emtorno darecta.

� Casos mais vulgares:� Reflexão em relação à origem: x’ = -x; y’ = -y� Reflexão segundo o eixoOx: x’ = x; y’ = -y� Reflexão segundo o eixoOy: x’ = -x; y’ = y� Reflexão segundo a rectax = y: x’ = y; y’ = x� Reflexão em relação a rectax = -y: x’ = -y; y’ = -x

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:ReflexãoReflexão (cont(cont……))

Exemplo: Pode-se aplicar uma reflexão em torno do eixox, (y = 0)utilizando a seguinte matriz de transformação:

Esta transformação mantém as coordenadasx do objecto inalteradas, masinverteos valoresdascoordenadasy, alterandoa orientaçãoespacialdo

(x'

y')=(1 00 − 1)(xy) ou P' = E . P

16

inverteos valoresdascoordenadasy, alterandoa orientaçãoespacialdoobjecto.

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:ReflexãoReflexão (cont(cont……))

Exemplo: Podemos também definir uma reflexão em torno de um eixoperpendicular ao planoxy e passando (por exemplo) pela origem dosistema de coordenadas,invertendonesse caso ambas as coordenadasx ey. A matriz de transformação é dada por:

Estaoperaçãoé ilustradanafiguraaseguir:

(− 1 00 − 1)

17

Estaoperaçãoé ilustradanafiguraaseguir:

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:ReflexãoReflexão (cont(cont......))

� Exercício:1. Determine a matriz de reflexão emrelação à linhaL,cujo declive ém e que intersecta o eixoOy em(0,b).

� Sugestão:� Utilizar os resultados do exemplo anterior e as seguintes

expressões:y

18

2. Determine a reflexão do losango cujos vértices sãoA(-1,0), B(0,-2), C(1,0), D(0,2) emrelação à (a) linhahorizontal y=2, (b) linha vertical x=2.

(0,b)

O xθ

P´

P

Se mentão

senm

me

m

tan( )

( )

cos( )

θ

θ

θ

=

=+

=+

2

2

11

1

L

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Generalizando….

P´ = M1 · P + M2onde� P eP’ (coordenadas de posição): vectores coluna� M1: matriz 2x2 comfactores de multiplicação.� M : matriz coluna de dois elementoscom termos de

19

� M2: matriz coluna de dois elementoscom termos detranslação.

� Observação:� para translações:M1 é matriz identidade

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Sistema de Coordenadas Homogéneas(SCHSCH)

� Infelizmente, a translação emℜ2 é formalizada de forma diferentedas outras - Rotação e Escala, etc. - que são tratadas atravésdemultiplicações.

para poder combinar convenientemente essas transformações,devemos tratar do mesmo modo todas as 3 transformações.

� Como podemsercalculadasastransformaçõesgeométricaspelo

20

Como podemsercalculadasastransformaçõesgeométricaspeloproduto concatenado das suas respectivas matrizes?

� R/ Utilizando umsistema de coordenadas homogéneas

� Nas coordenadas homogéneas adiciona-se ao tuplo(x, y) umaterceira coordenadaW passando a estar representado por um triplo(x, y, W)

� Por definição(x, y, W) e (x’ , y’, W’) representam o mesmo pontoem coordenadas homogéneas sse um é múltiplo do outro

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Sistema de Coordenadas Homogéneas(SCHSCH)

� É obvio que cada ponto(x, y) tem uma infinidade de representaçõesem coordenadas homogéneas

� Se W é não zero então(x, y, W) representam o mesmo ponto que(x/W, y/W, 1)

� Homogeneizar um par de coordenadas é obter a sua representação naforma de(x, y, 1)

21

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:DistorçãoDistorção ((ShearingShearing))

Distorção: É uma transformação que produz distorção de umobjecto e emgeral, é realizada quando se aplica umadeslocação aos valores das coordenadasx (x-shearing) ou dascoordenadasy (y-shearing) do objecto.

Exemplo: Por exemplo: uma distorção na direcçãox é produzida com aseguintematrizdetransformação:

22

seguintematrizdetransformação:

As coordenadas do objecto são transformadas da seguinte maneira:

x' = x + shx · y;y' = y

(x 'y '1 )= (1 shx 0

0 1 00 0 1

)(xy1) ou P'= D . P

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:DistorçãoDistorção (cont(cont……))

� Exemplo: Se shx é 2, então um quadrado serátransformado numparalelogramo.

� Pode-se gerar distorções na direcção relativamente aoutros eixos de referência. Por exemploy = yref com amatriz:

(1 shx − shx . yref )

23

� que produz as seguintes transformações sobre ascoordenadas:

x' = x + shx · (y - yref ),y' = y

(1 shx − shx . yref

0 1 00 0 1

)

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:DistorçãoDistorção (cont(cont……))

� Analogamente, pode-se aplicar uma distorção na direcção y, relativa a uma linha x = xref, utilizando:

(1 0 0shy 1 − shy . xref

0 0 1)

24

� que gera as seguintes transformações nas posições dascoordenadas:

x' = x, y' = y + shy · (x - xref )

Transformações Gráficas Bi-dimensionais� Transformações de Sistemas de Coordenadas

� Exercício:

1. Ilustre o efeito das transformaçõesx-shearing, y-shearinge xy-shearing sobre o quadrado A(0,0), B(1,0),C(1,1) e D(0,1), quandoSx = 2 eSy = 3

25

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais� Transformações secundárias:ShearingShearing (cont(cont......))

� Exemplo:Um observador colocado no ponto(0,0) vê o pontoP(1,1). Se oponto é trasladado uma unidade na direcçãov = I, a sua novaposição éP’(2,1). Suponha que, em vez disto, o observador dá umpasso atrás de uma unidade segundo o eixoOx. Quais ascoordenadas do ponto P relativamente ao observador?

Resolução: O problemapodeser consideradocomo uma transformação

26

Resolução: O problemapodeser consideradocomo uma transformaçãoentre sistemas de coordenadas. Se trasladarmos a origem na direcçãov = -I(para uma nova posiçãoO’), então as coordenadas dePneste sistema podemser determinadas pela transformação:

Isto tem a seguinte interpretação trivial:o deslocamento de uma unidade,numa dada direcção, pode ser alcançado quer movendo o objecto parafrente relativamente ao observador quer deslocando o observador paratrás em relação ao objecto.

=

1

1

2

1

1

1

100

010

101

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais�� TranslaçãoTranslação emem SCHSCH

� Num SCHSCH no plano os pontos são representados por vectores de 3elementos. Então as matrizes de transformações que multiplicam umponto por outro também precisam ser de 3x3.

� A equação de TranslaçãoTranslação

P´ = P + T(tx, ty)

para coordenadas homogéneas fica da seguinte forma:

27

� Então e equação da Translação em SCH Translação em SCH pode ser expressa como:

P´ = T(tx, ty) · P onde T(tx, ty) é a matriz de Translação em SCH Translação em SCH

(x 'y '1 )= (

1 0 t x

0 1 t y

0 0 1).(xy1)

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais�� Translação,Translação, RotaçãoRotação ee VariaçãoVariação dede EscaleEscale ememSCHSCH

�� TranslaçãoTranslação:: P’ = T(tx, ty) · P

�� RotaçãoRotação:: P’ = R(θθθθ) · P

28

�� RotaçãoRotação:: P’ = R(θθθθ) · P

�� VariaçãoVariação dede escalaescala:: P’= S(sx, sy) · P

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais�� ComposiçãoComposição dede TransformaçõesTransformações

� Com as representações matriciais anteriores podemos:� compor um matriz que realize qualquer sequência de

transformadas. Chamamos essa matriz dematrizmatriz compostacomposta dedetransformadatransformada

� O propósito fundamental de compor-se transformações, é oganho deeficiência que se obtém ao aplicar-se umatransformação compostaa um ponto em vez de aplicar-lhe umasérie de transformações, umaapósaoutra.

29

apósaoutra.� Exemplo: Duas translações sucessivas(tx1, ty1) e (tx2, ty2):

P’ = T(tx2, ty2) · (T(tx1, ty1) · P) = (T(tx2, ty2) · T(tx1, ty1)) · PA matriz composta da transformaçãoneste exemplo será:

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais�� ComposiçãoComposição dede TransformaçõesTransformações

� Exemplo: Duas varições de escalas sucessivas:

P' = S(sx1, sy1) · P e P'' = S(sx2, sy2) · P’ pode ser expressa como

P'' = S(sx2, sy2) · (S(sx1, sy1) · P ) = (S(sx2, sy2) · S(sx1, sy1)) · P

( ) ( )

30

a matriz produto S(sx2, sy2) · S(sx1, sy1) é:

Transformações Gráficas BiTransformações Gráficas BiTransformações Gráficas BiTransformações Gráficas Bi----dimensionaisdimensionaisdimensionaisdimensionais�� ComposiçãoComposição dede TransformaçõesTransformações (cont(cont……))

� Exemplo: Transladar P1(x1, y1) p/ origem, rotacionar e transladar devolta p/ P1

31

A transformação em sequência é:


� O procedimento anterior pode ser utilizado de forma similarparaefectuar avariação de escalade um objecto em relação a um pontoarbitrárioP1(x1, y1)

� Neste caso primeiramente o ponto P1 é transladado para a origem,então é feita a variação de escala desejada. A continuação o ponto P1 étransladado de volta.

� Dessa forma, a transformação em sequência é:

32


� Exemplo: Suponhamos que desejamos a seguinte sequencia detransformações:variação de escala, rotação e translação, tomando oponto P1(x1,y1) como o centro da rotação e da variação de escala (verfigura)

33

� A sequência de transformações fica da seguinte maneira:1. Transladar P1(x1,y1) para a origem;2. Efectuar a escala e a rotação desejadas;3. Efectuar a translação da origem para a nova posição P2(x2,y2), onde a casa deve ser posicionada.

T(x2,y2) · R(θθθθ ) · S(sx,sy) · T(-x1,-y1) é a MCT

Se a Variação de EscalaS for uniforme (sx = sy) a ordemdeS eR podeser comutada sem alterar o resultado final da transformaçãocomposição.


� Se M1 e M2 representam duas transformações fundamentais(translação, rotaçãoouvariação de escala). Então,

Em que casos M1 · M2 = M2 · M1?� Isto é,

Quando as matrizes da transformação podem ser comutadas seralterar o resultado final da transformação composição?

� É conhecido que nem sempre a multiplicação de matrizes é

34

� É conhecido que nem sempre a multiplicação de matrizes écomutativa.

� Entretanto é fácil mostrar que nos seguintes casos especiais estacomutatividade existe:

M 1 M 2

Translação Translação

V. De Escala V. De Escala

Rotação Rotação

V. De Esacla (com sx=sy)

Rotação

� Nestes casosnão precisamosestar atentos a ordem deconstrução da matriz detransformação.

Transformações Gráficas Bidimensionais...

Documents

Transcript of Transformações Gráficas Bidimensionais...