Bài giảng Đồ họa hiện thực ảo - Bài 4A: Các phép biến đổi Đồ hoạ (Affine Transformations)

(c) SE/FIT/HUT 2002 1
Bài 4 Các phép biến đổi Đồ hoạ
Affine Transformations
Le Tan Hung
Email: hunglt@it-hut.edu.vn
I KHái niệm cơ bản
II Các phép biến đổi
III Hệ tọa độ đồng nhất
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 2
Mô hình hoá - Modelling 
„ mô hình - model :
„ Modeling - Mô hình hoá
„ Thực thể cơ sở -
primitives
„ như circles, lines polygons 
hay cubes
„ Cảnh - A scene
„ mô hình hoá cảnh - Scene 
Modeling
object
A scene with several instances of the object
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Ví dụ
„ At each frame of the animation, the 
object is transformed, in this case by a 
rotation. It could also be transformed 
by changing its size (scaling), or its 
shape (deforming), or its location 
(translation). 
„ Further animation effects can be 
achieved by not changing the object, 
but the way it is viewed (i.e. the 
window to viewport transformation) at 
each frame (e.g. by zooming).
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 4
Phép biến đổi - Transformations 
„ Trong kỹ thuật đồ hoạ 3 bước: modeling, rendering, 
displaying
„ Với Modeling:
„ Phép biến đổi - Transformation
„ Biến đổi mô hình hoá - Modeling transformations
„ Biến đổi tạo góc nhìn - Viewing transformations
„ Biến đổi tạo Hoạt cảnh - Animation
modeling 
coordinate Modeling 
transformation
Viewing 
transformation
world 
coordinate
viewing 
coordinate (eye coordinate)
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 5
Transformations - Modeling
world
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 6
Viewing
Transformations - Viewing
„ Viewing 
„ Transformations - Viewing
„ Trong phép biến đổi này : 
„ Một mô hình có thể quan sát 
trên các góc cạnh khác nhau 
(e.g. faraway, near, looking 
down, looking up) WORLD
OBJECT
CAMERA
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 7
Phép biến đổi Affine
Affine Transformations?
„ Phép biến đổi Affine 
„ Ví dụ: phép biến đổi tọa độ với chỉ 2 điểm đầu cuối của
đoạn thẳng tạo thành 2 điểm mới mà khi nối chúng với
nhau tạo thành đoạn thẳng mới.
„ Các điểm nằm trên đoạn thẳng sẽ có kết quả là điểm
nằm trên đoạn thẳng mới với cùng phép biến đổi thông
qua phép nội suy.
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Phân loại - Transformations
„ Có 2 cách nhìn trên phép 
biến đổi 
„ Object Transformation: 
„ Coordinate 
Transformation 
„ Mỗi phương pháp có ưu 
nhược điểm riêng về bản 
chất tương đồng nhau
1,1
.4, 2
Example: OBJECT TRANSFORMATION
(1,1)
(1,1)
Example: COORDINATE TRANSFORMATION
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 9
Modeling Transformations
Transform objects/points Transform coordinate system
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
2D Object Transformations
„ A 2D object transformation alters each point P into a 
new point Q using a specific formula or algorithm.
„ It therefore alters the co-ordinates of P (Px,Py) into 
new values which specify point Q (Qx,Qy)
„ This can be expressed using some function T, that 
maps co-ordinate pairs into co-ordinate pairs:
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Matrix Representation
„ If affine transformation T maps P onto Q, then Q is related to P as 
follows:
„
„
„ where a, b, c, d, tx and ty are all constants, and ad = bc
„ This gives rise to the following matrix representation:
„ i.e. 


+






=



y
x
y
x
y
x
t
t
P
P
dc
ba
Q
Q
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 12
Các phép biến đổi hình học hai chiều
„ Phương pháp biểu diễn đối tượng P = [ x y ]
„ Phép biến đổi vị trí điểm
„ Thực thi phép biến đổi đúng trên 1 điểm ảnh sẽ đúng trên toàn bộ đối
tượng


=
dc
ba
T
y
x
z
pM
pW
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 13
Phép biến đổi
„ Phép bất biến
„ Phép biến đổi tỉ lệ - Scaling
„ A scaling changes the size of an object with two scale factors, Sx and Sy
„ Phép biến dạng
„ A shearing shears an object in a particular direction, (in 2D, it’s either in the x 
or in the y direction
xz
y
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 14
Phép quay- Rotation
y
( x, y )
xα
ρθ
ρ
( x’, y’ )
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 15
Thuộc tính cơ bản của phép biến đổi 
Affine Transformations
„ Preservation of lines:
„ Affine transformations map lines to lines;
„ Preservation of parallelism 
„ Preservation of proportional distances
„ Affine transformations change volume by | 
Det(M) |;
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Kết hợp các phép biến đổi
Composition of Affine Transforms
„ Any affine transformation can be 
decomposed into elementary 
transformations.
„ Mọi phép biến đổi phức tạp đều có
thể tạo thành từ các phép biến đổi cơ
sở như:
„ Dịch chuyển - Translation
„ Tỉ lệ - Scaling
„ Quay- Rotation
„ Biến dạng - Shearing
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Affine transformations preserve 
affine combinations
„ It is rare that we want to perform just one elementary 
transformation.
„ Usually an application requires that we build a complex 
transformation out of several elementary ones
„ e.g. translate an object, rotate it, and scale it, all in one move
„ These individual transformations combine into one overall 
transformation
„ This is called the composition of transformations.
„ The composition of two or more affine transformations is 
also an affine transformation
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 18
Thuộc tính 
„ Tác động lên tập các điểm đặc trưng của đối tượng tạo 
thành phép biến đổi cho đối tượng
„ We have defined each transformation by their effects on single 
points
„ In practice these will be applied to multiple points to transfer
entire scenes or objects made up of many defining points
T
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Điểm gốc - Pivotal points
Cho phép quay và tỉ lệ Rotation and Scaling
„ The simple versions of rotation and scaling have been based around the origin.
„ This means that when we rotate or scale, the object will also move, with 
respect to the origin
„ Translate all points through (-c1,-c2)
„ Rotate all points about the origin by
„ Translate all points back through (c1,c2) 
(c1,c2)
(0,0)
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Pivotal points
„ Often we wish to rotate or scale with respect to some pivotal 
point, not the origin
„ Most significantly, we often wish to rotate or scale an object 
about its centre, or midpoint
„ In this way, the object’s location does not change
„ To do this, we relate the rotation or scaling about the pivotal 
point V, to an elementary rotation or scaling about the origin
„ We first translate all points so that V coincides with the origin
„ We then rotate or about the origin
„ then all points are translated back, so that V is restored to its original 
location
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Hệ toạ độ đồng nhất
„ Vấn đề gặp phải:
„ An affine transformation is composed of a linear transformation 
followed by a translation
„ Unfortunately, the translation portion is not a matrix 
multiplication but must instead be added as an extra term, or 
vector
„ What we need is a “trick”, so that translations can be represented 
in matrix multiplication form
„ This then means that they can be easily composed with other 
transformations, by simply multiplying the matrices together
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 22
Tọa độ đồng nhất
Homogeneous Transform 
„ x' = ax + by + n
„ y' = bx + dy + m
„ Phương pháp biểu diễn mở rộng thông qua tọa độ đồng
nhất của các vector vị trí
„ Với ứng dụng của phép chiếu hình học mà ở đó tọa độ điểm
được mô tả dưới ma trận [ x* y* h]
„ với x = x*/h, y = y*/h, z = z*/h và h là một số thực tuỳ ý
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 23
Ưu điểm của Hệ tọa độ đồng nhất
Homogeneous Transform
„ Ðưa ra cái nhìn hợp nhất của các phép biến đổi dưới phép nhân
ma trận, hỗ trợ cho việc xử lý bằng cả phần cứng và phần mềm
„ Kết hợp các các phép biến đổi tạo thành ma trận tích đơn giản duy
nhất. Tránh nhầm lẫn về thứ tự của các phép nhân khi sử dụng.
„ Order matters: AB is generally not the same as BA
„ Cho phép kết hợp với cả các phép biến đổi đặc biệt không tuyến
tính khác(non-affine) như:
„ Phép chiếu phối cảnh - Perspective projections!
„ Uốn - Bends, Vuốt tapers v.v.v
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 24
Phép biến đổi với tọa độ đồng nhất
„ Ma trận biến đổi đồng nhất
„ Phép tịnh tiến 







=
1
0
0
][
nm
dc
ba
T
]1[
1
010
001
]1[]1''[ nymx
nm
yxyx ++=








=
(tx, ty, tz)
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 25
Phép tỉ lệ
]12.1.[
100
020
001
]1[]1''[ SySxS
S
yxyx =








=
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 26
Phép quay
y
( x, y )
xα
ρθ
ρ
( x’, y’ )
]1cos.sin.sin.cos.[ φφφφ yxyx +−=
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 27
Phép biến đổi tổng hợp
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 28
Phép chuyển đổi
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 29
Windows and Viewports
„ Mapping involves scaling and translation (moving).
„ Both the world window and viewport can be any aligned 
rectangle.
„ Usually the viewport is set to take up the entire screen 
window.
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 30
Phép biến đổi theo ma trận
„ Ma trận chuyển vị theo Window
„ Ma trận biến đổi tỉ lệ
„ Ma trận chuyển vị theo tọa độ viewport










−
−=
100
0
minmax
minmax0
00
Xwmin-Xwmax
Xvmin-Xvmax
]1[
YwYw
YvYvS
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 31
Ma trận biến đổi tổng hợp của phép chuyển đổi
tọa độ










−
−−−
−
−=
=
1
minmax
minmaxminmin
Xwmin-Xwmax
Xvmin-Xvmaxminmin
0
minmax
minmax0
00
Xwmin-Xwmax
Xvmin-Xvmax
][
]2[]1[]1[][
YwYw
YvYvYwYvXwXv
YwYw
YvYvT
TxSxTT
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002
Coordinate Transforms
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 33
Coordinate Transforms
(1,1)
u’
v’
(1,1)
u
v
x
y
Object defined in Local 
Coordinate System
Object after transformation in 
Global Coordinate System
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 34
x
y
x
y
Identity as a Coordinate Transform
P
100
010
001
Q








=
(1,1)
u
v
(1,1)
u’
v’
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 35
x
y
Translation
x
y
P
100
10
01
Q








= ty
tx
(1,1)
u
v
(1+tx,1+ty)
u’
v’








=
















11
0
0
ty
tx
ty
tx
100
10
01







 +
=
















1
1
1
0
1
ty
tx
ty
tx
100
10
01








+=
















1
1
1
1
0
ty
tx
ty
tx
100
10
01
origin
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 36
x
y
Rotation
x
y
P
100
0
0
Q







 −
= θθ
θθ
cossin
sincos
(1,1)
u
v
u ’
v ’








=
1
sin
cos
θ
θ
v







−
=
1
cos
sin
θ
θ
u








=
1
0
0
O
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 37
x
y
Scaling
x
y
P
100
0
0
Q








= sy
sx
0
0
(1,1)
u
v
(sx*1,sy*1)
u
v








=
1
0
0
O








=
1
0
syu








=
1
0
sx
v
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 38
Composite Transformations








−−
+−−
=
100
sin)cos1(cossin
sin)cos1(sincos
11
11
θθθθ
θθθθ
xy
yx
M
x
y
x
y
(1,1)
u
v
u ’
v
’








−−
+−
1
sin)cos1(
sin)cos1(
11
11
θθ
θθ
yy
yx








−−+
+−+
1
sin)cos1(sin
sin)cos1(cos
11
11
θθθ
θθθ
yy
yx








−−+
+−+−
1
sin)cos1(cos
sin)cos1(sin
11
11
θθθ
θθθ
yy
yx
O = 
v = 
u = 
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 39
Modeling Transformations
„ To make full use of the computational optimisation made 
possible by composite transforms, we only want to apply the 
transformations to points at the very end
„ i.e. the transformation operation (multiplying point p by 
transform matrix is the very last thing we do in the modelling 
phase)
Specify points 
in local coords
Specify 
Transformations
(composite if necessary)
Send to 
Pipeline
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 40
+ +
=This of course shouldn’t 
mean all objects need to 
share the same 
transformations
CuuDuongThanCong.com https://fb.com/tailieudientucntt
(c) SE/FIT/HUT 2002 41
+
=
+
transform +transform
+
transform
Obviously we want 
something more 
versatile
CuuDuongThanCong.com https://fb.com/tailieudientucntt