COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica...

28
MARCO ANTONIO GARCIA DE CARVALHO Fevereiro de 2009 Computação Gráfica COMPUTAÇÃO GRÁFICA Transformações geométricas

Transcript of COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica...

Page 1: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

COMPUTAÇÃO GRÁFICATransformações geométricas

Page 2: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Objetivos

•• Entender os princípios daEntender os princípios datransformações geométricas do tipotransformações geométricas do tipotranslação, rotação e escalamento.translação, rotação e escalamento.

•• Efetuar transformações geométricasEfetuar transformações geométricasutilizando coordenadas homogêneas.utilizando coordenadas homogêneas.

Page 3: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Fundamentos

•• Transformações geométricas envolvem Transformações geométricas envolvemoperações com vetores e matrizes, do tipooperações com vetores e matrizes, do tiposoma e multiplicação, além desoma e multiplicação, além deconhecimentos básicos de álgebra econhecimentos básicos de álgebra egeometria.geometria.

Page 4: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações básicas - OpenGL

•• Transla Translaçãoção

glTranslatefglTranslatef((dxdx, , dydy, , dzdz););

•• Escalamento Escalamento

glScalefglScalef((sxsx, , sysy, , szsz););

•• Rota Rotaçãoção

glRotatefglRotatef((angang, x, y, z);, x, y, z);

Page 5: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Translação

EXEMPLO 2DEXEMPLO 2D

posição inicialposição final

x

y

Page 6: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Translação

P1 = (1,1) P2 = (6,1)

P3

P4

P5

2

4

0

6

2 4 6 8 10

Nova posição da figura para dx = 6 e dy = 2

P1’ P2’

P3’

P4’

P5’

12 14

8

EXEMPLO 2DEXEMPLO 2D

Page 7: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Translação•• É uma operação que desloca pontos em umaÉ uma operação que desloca pontos em umadeterminada direção. Define-se através da equação:determinada direção. Define-se através da equação:

tal que, para o caso 2Dtal que, para o caso 2D

Onde x, y são os pontos originais; xOnde x, y são os pontos originais; x’’, y , y ’’ são os pontos são os pontosdeslocados; e deslocados; e dxdx, , dy dy correspondem ao deslocamentocorrespondem ao deslocamentonas direções x e y, respectivamente.nas direções x e y, respectivamente.

PP’’ = P + T = P + T

xy

x'y ’

dxdy

P = P’ = T =

Page 8: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Escala

situação inicial

situação final

x

y

x

y

EXEMPLO 2DEXEMPLO 2D

Page 9: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Escala

P1 = (2,1) P2 = (6,1)

P3P42

4

02 4 6 8

P1’= (4,2) P2’ = (12,2)

P3’P4’

Novo objeto para sx = 2e sy = 2

3

6

03 6 9 12

EXEMPLO 2DEXEMPLO 2D

Situação inicial

Situação final

Page 10: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Escala

xy

PP’’ = S · P = S · P

x'y ’

sx 00 sy

P = P’ = S =

•• Escalamento pode tornar um objeto maior Escalamento pode tornar um objeto maiorou menor. A equação abaixo define essaou menor. A equação abaixo define essaoperação.operação.

tal que, para o caso 2Dtal que, para o caso 2D

Page 11: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Rotação

situação inicial situação final

x

y

x

y

EXEMPLO 2DEXEMPLO 2D

Page 12: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Rotação

P1 = (2,1) P2 = (4,1)

P3P4

2

4

02 4 6 8

Novo objeto para θ =45º

2

02 4 6

P3’

P4’

P1’

P2’

Situação inicial

Situação final

EXEMPLO 2DEXEMPLO 2D

Page 13: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Rotação

PP’’ = R · P = R · P

•• Rotaciona Rotaciona (gira) um objeto de um(gira) um objeto de umdeterminado ângulo determinado ângulo θθ. É dada pela equação:. É dada pela equação:

xy

x'y ’

cosθ -sinθsinθ cosθP = P’ = R =

tal que, para o caso 2Dtal que, para o caso 2D

Page 14: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Rotação / Escala

•• Como pode ser visto nos desenhos Como pode ser visto nos desenhosanteriores, as operações de escalamento eanteriores, as operações de escalamento erotação também deslocam o objeto, poisrotação também deslocam o objeto, poisforam definidas a partir de um ponto naforam definidas a partir de um ponto naorigem.origem.

•• Portanto, para que não ocorra translação Portanto, para que não ocorra translaçãodesnecessária no objeto é preciso realizar asdesnecessária no objeto é preciso realizar asseguintes etapas:seguintes etapas:

Page 15: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Rotação / Escala

1. Transladar o objeto para a origem1. Transladar o objeto para a origem

2. 2. Rotacionar Rotacionar (ou efetuar o escalamento)(ou efetuar o escalamento)

3. Transladar o objeto para a posição original3. Transladar o objeto para a posição original

Objeto que se deseja modificarObjeto que se deseja modificar

Page 16: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Coordenadas homogêneas

PP’’ = R · P = R · P

•• As operações matriciais diferem entreAs operações matriciais diferem entreadição (translação) e multiplicação (rotação-adição (translação) e multiplicação (rotação-escala).escala).

PP’’ = S · P = S · P

PP’’ = P + T = P + T

•• Uma forma de tratar as transformaçõesUma forma de tratar as transformaçõesatravés da mesma operação é expressar osatravés da mesma operação é expressar ospontos em pontos em COORDENADAS HOMOGÊNEASCOORDENADAS HOMOGÊNEAS..

Page 17: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Coordenadas homogêneas

PP’’ = (R ou S ou T) · P = (R ou S ou T) · P

•• Todas as transformações são tratadasTodas as transformações são tratadasatravés de multiplicações. Portanto, podemosatravés de multiplicações. Portanto, podemosusar a expressão:usar a expressão:

Page 18: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Coordenadas homogêneas

•• Em coordenadas homogêneas, uma terceiraEm coordenadas homogêneas, uma terceiracoordenada é adicionada (caso 2D)coordenada é adicionada (caso 2D)

1 0 dx0 1 dy0 0 1

sx 0 00 sy 00 0 1

cosθ -sinθ 0sinθ cosθ 00 0 1

R = S =T =

xy1

P =

E as transformaE as transformações são escritas na forma:ções são escritas na forma:

Page 19: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações 3D

•• Matrizes de transformações para o caso 3DMatrizes de transformações para o caso 3D

1 0 0 dx0 1 0 dy0 0 1 dz0 0 0 1

sx 0 0 00 sy 0 00 0 sz 00 0 0 1

S =T =

TranslaçãoTranslação EscalaEscala

Page 20: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações 3D

•• Matrizes de transformações para o caso 3DMatrizes de transformações para o caso 3D

RotaçãoRotação

x

y

z Atenção!!! As rotações foramAtenção!!! As rotações foramdefinidas no sentido anti-horário.definidas no sentido anti-horário.

Page 21: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações 3D

•• Matrizes de transformações para o caso 3DMatrizes de transformações para o caso 3D

RotaçãoRotaçãocosθ -sinθ 0 0sinθ cosθ 0 00 0 1 00 0 0 1

Rz (θ) =

cosθ 0 sinθ 00 1 0 0-sinθ 0 cosθ 00 0 0 1

Ry (θ) =

1 0 0 00 cosθ -sinθ 00 sinθ cosθ 00 0 0 1

Rx (θ) =

Page 22: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações 3D

•• Outras transformaçõesOutras transformações

CisalhamentoCisalhamento ReflexãoReflexão

Page 23: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações - OpenGL•• O O OpenGL OpenGL trabalha comtrabalha com m matrizes deatrizes detransformaçõestransformações•• As opera As operações sãoções são efetuadas viaefetuadas viamultiplicação de matrizes, de acordo com omultiplicação de matrizes, de acordo com oestado existenteestado existente•• Portanto, é necessárioPortanto, é necessário ““carregarcarregar”” a matriz a matrizidentidadeidentidade

glLoadIdentityglLoadIdentity();();

Page 24: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações - OpenGL•• O OpenGL trabalha com matrizes de O OpenGL trabalha com matrizes detransformações...transformações...

Utiliza-se o comando Utiliza-se o comando glMatrixModeglMatrixMode

Parâmetro GL_PROJECTION antes dosParâmetro GL_PROJECTION antes doscomandos que especificam o tipo decomandos que especificam o tipo deprojeção (glOrtho, por exemplo).projeção (glOrtho, por exemplo).

Parâmetro GL_MODELVIEW antes deParâmetro GL_MODELVIEW antes detransformações geométricas.transformações geométricas.

glMatrixMode(GL_PROJECTION);glMatrixMode(GL_PROJECTION);

glMatrixMode(GL_MODELVIEW);glMatrixMode(GL_MODELVIEW);

Page 25: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações - OpenGL

•• Uma transformação pode alterar todos osUma transformação pode alterar todos osobjetos na objetos na sequênciasequência: não desejado,: não desejado,dependendo da aplicaçãodependendo da aplicação•• OpenGLOpenGL: escopo das transformações...: escopo das transformações...

São utilizados comando São utilizados comando glPushMatrixglPushMatrix() e() eglPopMatrixglPopMatrix() para definir início e fim do bloco() para definir início e fim do blocode objetos onde será(de objetos onde será(ãoão) efetuada(s) a(s)) efetuada(s) a(s)transformação(transformação(õesões).).

Page 26: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações - OpenGL

•• OpenGL: escopo das transformações... OpenGL: escopo das transformações...

Objeto1Objeto1glPushMatrix ();glPushMatrix ();

glPopMatrix ();glPopMatrix ();

glRotatef(...);glRotatef(...);

Objeto1Objeto1

glPushMatrix ();glPushMatrix ();

glPopMatrix ();glPopMatrix ();

glRotatef(...);glRotatef(...);Objeto2Objeto2

Objeto2Objeto2

Page 27: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Transformações - OpenGLvoid display(void){ glClear (GL_COLOR_BUFFER_BIT); glPushMatrix();

/* Cubo 1 */ glPushMatrix(); glTranslatef (-2.0, 0.0, 0.0); glScalef (2.0, 1.0, 4.0); glutWireCube (1.0); glPopMatrix();/* Cubo 2 */ glPushMatrix(); glRotatef (25.0, 0.0, 0.0, 1.0); glTranslatef (2.0, 0.0, 0.0); glScalef (2.0, 1.0, 4.0); glutWireCube (1.0); glPopMatrix();/* Cubo 3 */ glPushMatrix(); glTranslatef (0.0, 2.0, 0.0); glScalef (2.0, 1.0, 4.0); glutWireCube (1.0); glPopMatrix();/* Cubo 4 */ glPushMatrix(); glTranslatef (0.0, -2.0, 0.0); glScalef (2.0, 1.0, 4.0); glutWireCube (1.0); glPopMatrix();

glPopMatrix(); glutSwapBuffers();}

Page 28: COMPUTAÇÃO GRÁFICA - ft.unicamp.brmagic/ST765/CG2009_Transformacoes.pdf · Computação Gráfica COMPUTAÇÃO GRÁFICA ... Situação inicial Situação final EXEMPLO 2D. MARCO

MARCO ANTONIO GARCIA DE CARVALHOFevereiro de 2009

Computação Gráfica

Para saber mais:

[MANSSOUR06] Capítulo 9

[ANGEL97] Capítulo 4

Executar programas do Nate Robins