46
Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Embed Size (px)

Citation preview

Page 1: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Computação Gráfica – Transformações Geométricas

Profa. Mercedes Gonzales Márquez

Page 2: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Tópicos

Transformação Geométrica Revisão sobre matrizes e vetores As três transformações geométricas básicas:

Translação, Escala e Rotação.

Page 3: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Transformação Geométrica Transformação que altera algumas características

como posição, orientação, forma ou tamanho das figuras geométricas no espaço.

Apresentamos as três transformações básicas

x

y

ac

b

x

y

ac

b

y

x

Translação Escala Rotação

Page 4: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Revisão de matrizes e vetores

Matrizes em Computação Gráfica– As matrizes são mais fáceis de usar e entender do

que as equações algébricas– As matrizes são parecidas com o modelo

organizacional da memória dos computadores– Matrizes quadradas de 2 x 2 – 2D (x,y)

3 x 3 – 3D (x,y,z)

Page 5: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Aritmética de Vetores e Matrizes Adição : [1 2 3] + [2 0 1] = [3 2 4] Subtração : [1 2 3] – [2 0 1] = [-1 2 2] Multiplicação de uma matriz por um escalar:

401

221802

442

Multiplicação entre matrizes:Multiplicação entre matrizes:

21

1841617

0463547302615271

0567

4321

xxxxxxxx

Page 6: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Multiplicação entre matrizes(exemplos)Multiplicação entre matrizes(exemplos) 43,

21

wv

wv vw

43

,21wv

wv vw Impossível

Possível

Twv Twv Possível

Transposta de um vetor ou matriz: Transposta de um vetor ou matriz: 2121

T

Aritmética de Vetores e MatrizesAritmética de Vetores e Matrizes

Page 7: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Associativa: A.(B.D) = (A.B).D.Distributiva à direita: A.(B + D) = A.B + A.D.Distributiva à esquerda: (A + B).D = A.D + B.D.Existência de elemento neutro: A.I = I.A = A. Uma matriz I de ordem

n é uma matriz identidade, se ijk = 1, quando j = k e os outros elementos são nulos.

Propriedades do Produto de MatrizesPropriedades do Produto de Matrizes

Page 8: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Transformações lineares: Translação

x

y

a =x

y

c

b yx tyytxx ','

x’

y’

Transladar significa movimentar o objeto. Transladamos um objeto transladando todos os seus pontos. Para obter a partir de um ponto (x,y) um novo ponto (x’,y’) no plano adicionamos quantidades às suas coordenadas.

Page 9: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Transformações lineares: Escala

x

y

a =x

y

y´ a =́

Redução (0< sx, sy<1) ,Aumento (sx,sy >1)

c

b

yx

ss

ysxs

yx

y

x

y

x

00

''

y

x

ss0

0S

ysyxsx yx ','

Escalar significa mudar as dimensões de escala. Para isso multiplicamos os valores de suas coordenadas por um fator de escala.

Page 10: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Transformações lineares: Rotação

y´ p' =

r

x´ = x.cos - y.sen y´ = x.sen + y.cos

x

y

p =x

y

r

r

sincoscossinsinsincoscos

rrrr

yx

yx

cossinsincos

''

r

sinsin - coscos )cos(sincos cossin )sin(

)sin()cos(

''

rr

yx

Rotacionar significa girar. Na Figura abaixo mostra-se a rotação de um ponto p em torno da origem (0,0), passando para a posição p’.

Matriz de rotação no plano xy por um ângulo Ө

Page 11: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Resumo - Transformações 2D

tytx

yx

yx

''

yx

ss

yx

y

x

00

''

Translação

yx

yx

cossinsincos

''

Escala

Rotação

Page 12: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Transformações 3D

tztytx

zyx

zyx

'''

zyx

ss

s

zyx

z

y

x

000000

'''

Translação

zyx

zyx

1000cossin0sincos

'''

Escala

Rotação ao redor do eixo z

Page 13: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Rotações 3D

cos0010

0cos:)(

sen

senRy

1000cos0cos

:)(

sensen

Rz

Plano yz

Planoxy

Plano zx x

y

z

cos0cos0

001:)(

sensenRx

Page 14: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Rotação em torno de um ponto que não é a origem

Caso de um objeto não estar definido na origem do sistema de coordenadas- A multiplicação de suas coordenadas por uma matriz de rotação também resulta em um translação.

x

y

(9,2)(5,2)

(7,7)

x

y y

P

x

Em torno da origem

Em torno de P

Page 15: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Para alterar a orientação de um objeto em torno de um certo ponto, é necessário, (1) realizar uma translação para localizar esse ponto na origem do sistema, (2) aplicar a rotação desejada e, (3) Aplicar uma translação inversa

Rotação em torno de um ponto que não é a origem

Page 16: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

x

y

P

x

y

(1) (2) (3)

y y

P

Objeto original Depois da Translação de Após Rotação Após Translação que P à origem retorna à posição original

Rotação em torno de um ponto que não é a origem

Page 17: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Coordenadas homogêneas

Translação não é linear. Como representar em forma de matriz? x’=x+tx y’=y+ty z’=z+tz

Solução: uso de coordenadas homogêneas

Page 18: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Coordenadas Homogêneas

• Adiciona uma terceira coordenada w.

• Um ponto 2D passa a ser um vetor com 3 coordenadas• Uma transformação do sistema homogêneo para o cartesiano se dá pela seguinte relação: (x’,y’)=(x/w,y/w)•W=1 a transformação entre os espaços é direta de modo que, (x,y,1) no sistema homogêneo tem os mesmos valores no espaço cartesiano 2D: (x,y).

Page 19: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Transformações 3D

Page 20: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Transformações 3D

1000010000cos00cos

:)(

sen

sen

Rz

10000cos00cos00001

:)(

sen

senRx

Rotação : glRotatef(angle,x,y,z)

10000cos0001000cos

:)(

sen

sen

Ry

Plano yz

Planoxy

Plano zx x

y

z

Page 21: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Analogia da Câmera (OpenGL)

O processo de transformação para produzir a cena desejada para visualização é análogo a tirar uma foto com uma câmera.

Page 22: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

O modelo de visualização em OpenGL, é similar a uma câmera fotográfica!– Tripé: visualização– Modelo: modelagem– Lente: projeção– Papel: viewport

A Câmera OpenGL

Page 23: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Analogia da Câmera (OpenGL)

O processo de transformação para produzir a cena desejada para visualização é análogo a tirar uma foto com uma câmera. Os passos são:– 1. Orientar a câmera em direção da cena (transformação de

visualização) – 2. Posicionar devidamente o(s) objeto(s), a serem

fotografados, no cenário (transformações geométricas estudadas em aula, também chamadas transformações de modelagem).

– 3. Escolher o lente da câmera ou ajustar o zoom (transformação de projeção).

– 4. Determinar o tamanho desejado para a fotografia final (transformação de viewport).

Page 24: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Orientar a câmera em direção da cena (transformação de visualização)

Page 25: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Orientar a câmera em direção da cena (transformação de visualização)

A câmera em OpenGL “por default” tem sua posição na origem de coordenadas (0,0,0) e a sua orientação é com vetor up=(0,1,0). Existem três opções para mudar sua posição e orientação:

(1) Usar glTranslate*() e glRotate*(). Move a camera ou move todos os objetos em relação a uma camera fixa;(2) gluLookAt()

Page 26: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Visualizando devidamente o objeto (Exemplo)

Objeto e câmera na origem

Page 27: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Visualizando devidamente o objeto

Para visualizá-lo tenho duas opções:(a) Mudar a câmera, ou(b) Mudar o objeto

Com a câmera na origem (0,0,0) não posso visualizar devidamente um objeto na posição (0,0,0)

Page 28: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

glTranslatef(0.0, 0.0, -5.0);

(b) Mudando o objeto

Usando glTranslate() e glRotate()

Page 29: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Usando gluLookAt

gluLookAt(eyex, eyey, eyez, centerx, centery, centerz,upx, upy, upz)

(a) Mudando a câmera

Page 30: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

gluLookAt

A cena é construída na origem e definimos uma posição arbitrária para a câmera

void gluLookAt (eyex, eyey, eyez, centerx, centery, centerz, upx, upy, upz);

– Eye: localização da camera– Center: para onde a camera aponta– Up: vetor de direção de topo da camera

Page 31: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

gluLookAt

Page 32: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Exemplo – Cubo (Programa cube.c)

Um cubo é escalado pela transformação de modelagem glScalef (1.0, 2.0, 1.0). A transformação de visualização gluLookAt(), posiciona e orienta a câmera em direção do cubo. As transformações de projeção e viewport são também especificadas.

Page 33: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Exemplo – Cubo (Programa cube.c)

Example 3-1 : Transformed Cube: cube.c#include <GL/gl.h>#include <GL/glu.h>#include <GL/glut.h>void init(void){glClearColor (0.0, 0.0, 0.0, 0.0);glShadeModel (GL_FLAT);}

Page 34: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Exemplo – Cubo (Programa cube.c)void display(void){glClear (GL_COLOR_BUFFER_BIT);glColor3f (1.0, 1.0, 1.0);glLoadIdentity (); /* clear the matrix *//* viewing transformation */gluLookAt (0.0, 0.0, 5.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0);glScalef (1.0, 2.0, 1.0); /* modeling transformation */glutWireCube (1.0);glFlush ();}

Page 35: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Exemplo – Cubo (Programa cube.c)

void reshape (int w, int h){glViewport (0, 0, (GLsizei) w, (GLsizei) h);glMatrixMode (GL_PROJECTION);glLoadIdentity ();glFrustum (-1.0, 1.0, -1.0, 1.0, 1.5, 20.0);glMatrixMode (GL_MODELVIEW);}

Page 36: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Exemplo – Cubo (Programa cube.c)int main(int argc, char** argv){glutInit(&argc, argv);glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB);glutInitWindowSize (500, 500);glutInitWindowPosition (100, 100);glutCreateWindow (argv[0]);init ();glutDisplayFunc(display);glutReshapeFunc(reshape);glutMainLoop();return 0;

}

Page 37: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Matrizes de transformação

glMatrixMode(GL_MODELVIEW);- Define a matriz de transformação de visualização.

Após isso deve-se definir a câmera com gluLookAt ou definir as transformações geométricas glRotate e/ou glTranslate para orientar e posicionar os objetos em relação da câmera.

Page 38: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Pilha de Matrizes – Hierarquia de objetos

As vezes queremos construir objetos hierarquicos nos quais objetos complicados são construidos a partir de objetos mais simples. Por exemplo,(a)Uma mesa ou(b)um automovel com 4 rodas onde cada uma delas é ligada ao carro com cinco parafusos.(c)O corpo humano

Page 39: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Pilha de Matrizes – Hierarquia de objetos

Tronco

Coxa

Canela

Page 40: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Pilha de Matrizes – Hierarquia de objetos

Os passos para desenhar um carro serião: -Desenhe o corpo do carro.-Guarde a posição onde estamos e translade à direita a roda da frente. -Desenhe a roda e elimine a última translação talque a posição corrente esteja de volta na origem do carro. -Guarde a posição onde estamos e translade à esquerda a roda da frente ....Assim, para cada roda, desenhamos a roda, guardamos a posição onde estamos, e sucessivamente transladamos a cada uma das posições que os parafusos são desenhados, eliminamos as transformações depois que cada parafuso é desenhado.

Page 41: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Pilha de Matrizes – Hierarquia de objetos

glPushMatrix glPopMatrix

Page 42: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Pilha de Matrizes – Hierarquia de objetos

Desenhe um automovel asumindo que existem as rotinas que desenham o corpo do carro, a roda e o parafuso.

Example 3-4 : Pushing and Popping the Matrixdraw_wheel_and_bolts(){

long i;draw_wheel();for(i=0;i<5;i++){glPushMatrix();glRotatef(72.0*i,0.0,0.0,1.0);glTranslatef(3.0,0.0,0.0);draw_bolt();glPopMatrix();}}

Page 43: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Pilha de Matrizes – Hierarquia de objetos

draw_body_and_wheel_and_bolts(){draw_car_body();glPushMatrix();glTranslatef(40,0,30); /*move to first wheel position*/draw_wheel_and_bolts();glPopMatrix();glPushMatrix();glTranslatef(40,0,-30); /*move to 2nd wheel position*/draw_wheel_and_bolts();glPopMatrix();

... /*draw last two wheels similarly*/}

Page 44: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Formas geométricas tridimensionais

As formas geométricas tridimensionais que mais usaremos e que a Glut fornece são:void glutWireSphere(GLdouble radius, GLint slices, GLint stacks);void glutSolidSphere(GLdouble radius, GLint slices, GLint stacks);void glutWireCube(GLdouble size);void glutSolidCube(GLdouble size);void glutWireTorus(GLdouble innerRadius, GLdouble outerRadius,GLint nsides, GLint rings);void glutSolidTorus(GLdouble innerRadius, GLdouble outerRadius,GLint nsides, GLint rings);

Page 45: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Formas geométricas tridimensionaisvoid glutWireIcosahedron(void);void glutSolidIcosahedron(void);void glutWireOctahedron(void);void glutSolidOctahedron(void);void glutWireTetrahedron(void);void glutSolidTetrahedron(void);void glutWireDodecahedron(GLdouble radius);void glutSolidDodecahedron(GLdouble radius);void glutWireCone(GLdouble radius, GLdouble height, GLint slices,GLint stacks);void glutSolidCone(idem);void glutWireTeapot(GLdouble size);void glutSolidTeapot(GLdouble size);

Page 46: Computação Gráfica – Transformações Geométricas Profa. Mercedes Gonzales Márquez

Exercício(1)Faça um programa C/OpenGL que desenhe uma mesa

retangular, a partir de cubos (glutWireCube) e transformações de modelagem.

(2)Oriente devidamente a câmera, de forma que obtenhamos as seguintes imagens da mesa:

(a) (b)

(c) (d)