gráficos por computadora - ilapep - inicioilapep.mx/g1/unidad2/transformaciones2d.pdfde este modo,...

30
Gráficos por Computadora Mtro. J. Fco. Jafet Pérez L. Transformaciones Geométricas Bidimensionales

Upload: phungphuc

Post on 21-Sep-2018

228 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Gráficos por

Computadora

Mtro. J. Fco. Jafet Pérez L.

Transformaciones Geométricas Bidimensionales

Page 2: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Objetivo

Analizaremos los procedimientos estándares

para realizar transformaciones geométricas

bidimensionales sobre objetos gráficos

inmersos en algún marco de referencia

específico (real o virtual).

Page 3: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Existen básicamente tres operaciones o

transformaciones geométricas básicas, a partir

de las cuales se pueden realizar todas las

demás. Estas transformaciones son la traslación,

el escalamiento y la rotación, todas respecto del

origen.

Page 4: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Traslación o Desplazamiento

La traslación o desplazamiento se refiere a

mover un punto, un conjunto de puntos o un

objeto compuesto, de su ubicación original

hacia una nueva ubicación en su marco de

referencia.

La operación tiene un parámetro: el vector de

desplazamiento.

Page 5: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Como podemos ver en la figura, el cuadro que representaremos de

manera abstracta como P ha sido trasladado en un valor de (3,-1)

(este es el parámetro de la operación).

En su nueva ubicación lo llamaremos P'.

Tomemos su esquina inferior izquierda como base: Su posición

original era (2,3) y la nueva es (5,2). El mismo desplazamiento ha

afectado a todos los demás puntos del cuadro.

Page 6: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Escalamiento

El escalamiento es la operación que nos permiteagrandar o empequeñecer un conjunto de puntos oun objeto compuesto. La operación requiere dedos parámetros: el factor de escalamiento aaplicar en x y el factor de escalamiento a aplicaren y. La operación requiere además, de un puntode referencia, típicamente el origen del marco dereferencia.

En el caso de aplicar escalamiento básico a unpunto, se produce el efecto de acercarlo o alejarlodel punto de referencia.

Page 7: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

En la siguiente figura, se muestra un ejemplo de escalamiento.

Escalamos el cuadro representado por P tomando como

referencia al origen y con factores de escalamiento 1/3 en x, y

1/2 en y. El efecto, debido a que ambos factores son menores

que 1, es que todos los puntos del cuadro P se han acercado al

origen (pero más en x que en y).

Page 8: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Ejemplo 2

P (en la misma posición que en el ejemplo anterior) tomando

como referencia a su esquina inferior derecha y con factores de

escalamiento 1/2 en x, y 1/2 en y. (Este es un escalamiento compuesto

ya que para lograrlo, se requiere realizar dos operaciones, escalamiento y

traslación)

Page 9: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Rotación

La rotación es la más compleja de las operaciones otransformaciones geométricas básicas. Consiste en girarun punto, un conjunto de puntos o un cuerpocompuesto, al rededor de un punto de referencia (elcentro de rotación), típicamente el origen del marco dereferencia. Requiere como parámetro el ángulo derotación.

La rotación más simple es aquella que se realiza ensentido antihorario y utiliza como centro de rotación alorigen del marco de referencia.

Page 10: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

En la siguiente figura, se ilustra la rotación de P, que está en las

coordenadas (6, 2). La rotación es de π/6 en sentido contrario al de

las agujas del reloj a partir del eje x+. El punto de referencia es el

origen del marco de referencia. Las coordenadas del punto inferior

izquierdo de P' son (4.1962; 4.7321).

Page 11: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Representación matricial.

Aunque existen diversas maneras de representar

las coordenadas de los objetos gráficos y de

representar las transformaciones geométricas

que operan sobre ellos, vamos a elegir la más

estándar y flexible.

Los puntos se representan como vectores

columna de tamaño 3 x 1:

Page 12: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

La operación de traslación bidimensional se

representa como una matriz de 3 X 3:

Page 13: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

La operación de escalamiento bidimensional

(con el origen como punto de referencia) se

representa similar:

Page 14: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

La operación de rotación bidimensional

(respecto del origen, en el sentido opuesto al de

las manecillas del reloj) se representa así:

Page 15: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

De este modo, para efectuar transformaciones geométricas

básicas, esas "funciones" en forma de matrices, deben

premultiplicarse por los puntos que se pretende transformar, así:

P' = T(dx, dy) . P significa que P' es P con un

desplazamiento de (dx, dy)

P' = S (sx, sy) . P significa que P' es P con factores de

escalamiento sx en x y sy en y tomando el origen como

referencia.

P' = R(θ) . P significa que P' es P con una rotación de θ

radianes en sentido opuesto al movimiento de las

manecillas del reloj, a partir del eje x+, tomando como

eje de rotación al origen del marco de referencia.

Page 16: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Ejercicio: Escale la siguiente figura en un factor

de 2,3. Traslade la figura resultante con un

vector de 1, -1. Por último rote la figura original

45 grados.

Page 17: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Escale la siguiente figura en un factor de 2,3.

P1 (2,2)

P2 (2,4)

P3 (4,4)

P4 (4,2)

Page 18: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Escale la siguiente figura en un factor de 2,3.

Page 19: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

P1’ = 4 P2’= 4

6 12

1 1

P3’ = 8 P4’= 8

12 6

1 1

Page 20: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

P1' = 4,6

P2' = 4,12

P3' = 8,12

P4' = 8,6

Page 21: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Traslade la figura resultante con un vector de 1, -1.

P5 = 4,6

P6 = 4,12

P7 = 8,12

P8 = 8,6

Page 22: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

P5 = 4,6

P6 = 4,12

P7 = 8,12

P8 = 8,6

Page 23: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

P5’ = 5 P6’= 5

5 11

1 1

P7’ = 9 P8’= 9

11 5

1 1

Page 24: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma
Page 25: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Por último rote la figura original 45 grados.

P1 (2,2)

P2 (2,4)

P3 (4,4)

P5(4,2)

Page 26: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma
Page 27: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

P1’=

P2’ =

(0.7071)·2 + (-0.7071)·2 + 0·1 = (1.4142) + (-1.4142) + 0 = 0

(0.7071)·2 + (0.7071)·2 + 0·1 = (1.4142) + (1.4142) + 0 = 2.8284

0·2 + 0·2 + 1·1 = 0 + 0 + 1 = 1

(0.7071)·2 + (-0.7071)·4 + 0·1 = (1.4142) + (-2.8284) + 0 = -1.4142

(0.7071)·2 + (0.7071)·4 + 0·1 = (1.4142) + (2.8284) + 0 = 4.2426

0·2 + 0·4 + 1·1 = 0 + 0 + 1 = 1

Page 28: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

P3’=

P4’ =

(0.7071)·4 + (-0.7071)·4 + 0·1 = (2.8284) + (-2.8284) + 0 = 0

(0.7071)·4 + (0.7071)·4 + 0·1 = (2.8284) + (2.8284) + 0 = 5.6568

0·4 + 0·4 + 1·1 = 0 + 0 + 1 = 1

(0.7071)·4 + (-0.7071)·2 + 0·1 = (2.8284) + (-1.4142) + 0 = 1.4142

(0.7071)·4 + (0.7071)·2 + 0·1 = (2.8284) + (1.4142) + 0 = 4.2426

0·4 + 0·2 + 1·1 = 0 + 0 + 1 = 1

Page 29: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma
Page 30: Gráficos por Computadora - ILAPEP - Inicioilapep.mx/g1/unidad2/transformaciones2d.pdfDe este modo, para efectuar transformaciones geométricas básicas, esas "funciones" en forma

Ejercicio: Diseñe la inicial de su nombre en un

plano cartesiano. Escale su figura al doble de

tamaño. Mueva la figura resultante dos

unidades a la derecha y dos hacia arriba. Rote

la figura resultante 30 grados antihorario

tomando como centro de rotación el origen.