two-dimensional geometric
DESCRIPTION
TWO-DIMENSIONAL GEOMETRIC. TRANSFORMATION. Translation Rotation Scaling Shearing. ภาพ (Image) ในที่นี้แบ่งออกเป็น 2 ประเภท. Primitive drawing ภาพที่เกิดจากคำสั่งพื้นฐาน เช่น จุด เส้นตรง วงกลม สามเหลี่ยม สี่เหลี่ยม เส้นโค้ง ฯลฯ. 2. Complex - PowerPoint PPT PresentationTRANSCRIPT
TWO-DIMENSIONAL GEOMETRICTWO-DIMENSIONAL GEOMETRIC
TRANSFORMATIONTRANSFORMATION
• Translation• Rotation• Scaling• Shearing
ภาพ (Image) ในที่�น�แบ่ งออกเป็�น 2 ป็ระเภที่
1. Primitive drawing ภาพที่�เก�ดจากคำ�าสั่�งพ�นฐาน เช่ น จ ด เสั่!นตรง วงกลม สั่ามเหล�ยม สั่�เหล�ยม เสั่!นโคำ!ง ฯลฯ
2. Complex ภาพที่�เก�ดจาก จ ด (pixel) มาป็ระกอบ่ก�นเข้!า เช่ น คำน บ่!าน ว�ว ภาพที่�เป็�น bitmap
TRANSLATIOTRANSLATIONNเป็�นการย้าย้ตำ�าแหน�งของภาพจากเดิ�ม
ไป็สู่��ตำ�าแหน�งใหม�หร�อจากจ�ดิ (x,y) เดิ�ม ไป็เป็�น (x’,y’) โดิย้ที่!"
โดยที่� H เป็�นระยะที่างที่�เป็ล�ยนแป็ลงในแกนนอน (แกน x) V เป็�นระยะที่�เป็ล�ยนแป็ลงในแกนต�ง (แกน y)
(x,y)
(x’,y’)X’ = x + HY’ = y + VH
V
x
y
x
y
ROTATIONROTATION
เป็�นการหม�นของวั$ตำถุ� โดิย้เป็ลี่!"ย้นตำามม�มของการหม�น (rotation angle) ในที่�ศที่างที่วันเข(มนาฬิ�การอบจ�ดิหม�น (pivot point)
ในระบบแกนโพลี่าร,โคออร,ดิ�เนตำ x = r cos y = r sin
r
rsin
rcos
(x,y)
x
y
ในที่!"น!. r = √x2+y2 =√12+12 = √2 = tan-1 1 = 45 องศาโพลี่าร,โคออร,ดิ�เนตำ x = r cos = √2 cos 45 = √2 (1/√2 ) = 1 = x y = r sin = √2 sin 45 = √2 (1/√2 ) = 1 = y
r
y = rsin
x = rcos
(1,1)
x
y
1
1
(x,y)
(x’,y’)
rr
จ ด (x,y) เด�มหม นไป็ในที่�ศที่างที่วนเข้-มนาฬิ�กาไป็เป็�นม ม จะได!พ�ก�ดจ ด (x’,y’) โดยที่� x’ = r x cos (+) y’ = r x sin (+)
โดยใช่!กฎข้อง sine และ cosine ตามหล�กตร�โกณม�ต�ได! x’ = r x cos() x cos() - r x sin () x sin() y’ = r x sin() x cos() + r x cos () x sin()
x
y
x = r cos()Y = r sin ()
Cos(A+B) = Cos(A)Cos(B) – Sin(A)Sin(B)Sin(A+B) = Sin(A)Cos(B) + Cos(A)Sin(B)
Pivot Point Pivot Point
X’ = X x cos() - Y x sin ()
Y’ = Y x cos() + X x sin()
xx
yy
ในกรณ�ข้องการหม นว�ตถุ ด!วยม มรอบ่จ ดหม น (pivot point) โดยม�จ ดหม นไม ได!อย2 ที่�จ ดก�าเน�ด (origin) ต!องคำ�านวณตามล�าด�บ่ข้�นตอนด�งน�
1 .ย!ายจ ดหม น (pivot point) มาอย2 ที่�จ ด origin ด�งน�นที่ กๆจ ดข้องว�ตถุ ต!องย!ายมาอย2 ต�าแหน งใหม (x’,y’) โดยที่� X’ = X – xp y’ = Y - yp
2. ที่�าการ rotate ด!วยม ม รอบ่จ ด origin ได!จ ดใหม (x’,y’)
X’’ = X’ x cos() – Y’ x sin ()
Y’’ = Y’ x cos() + X’ x sin()โดยการจ�ดเที่อมที่างตร�โกณม�ต� และแที่นคำ า x’,y’ ลงในสั่มการ
X’’ = (X-xp) x cos() – (Y-yp) x sin ()
Y’’ = (Y-yp) x cos() + (X-xp) x sin()
3. ที่�าการย!ายจ ดหม นกล�บ่สั่2 จ ด pivot point เด�มได!จ ด (x’’’,y’’’)
X’’’ = X’’ + xp
Y’’’ = Y’’ + yp
แที่นคำ า x’’,y’’ ลงในสั่มการได!
X’’’ = (X-xp) x cos() – (Y-yp) x sin () + xp
Y’’’ = (Y-yp) x cos() + (X-xp) x sin() + yp
(xp,yp)
Object 1. Translate
(xp,yp)
2. Rotate
(xp,yp)
3. Translate
(xp,yp)
SCALINGSCALING
การลี่ดิหร�อขย้าย้ขนาดิของร�ป็ สู่ามารถุเป็ลี่!"ย้นแป็ลี่งขนาดิของวั$ตำถุ�ไดิโดิย้น�าจ�ดิใดิๆ ที่!"ป็ระกอบข0.นเป็�นวั$ตำถุ� ค�ณก$บค�า Scaling Factor
• 1Scalingf act or > ว�ตถุ ที่�ได!ข้นาดใหญ่ กว าเด�ม• Scaling factor < 1 ว�ตถุ ที่�ได!เล-กกว าเด�มในการ scaling ม�จ ดในการก�าหนดต�าแหน งข้องว�ตถุ ที่�ต!องการลดหร�อข้ยาย เร�ยกว า fixed point ถุ!าก�าหนด fixed point ที่� origin(0,0) จ ด (x,y) ต!องการ scale ด!วย Sx ที่�ศที่างในแนวแกน X Sy ที่�ศที่างในแนวแกน Y
ได!จ ดใหม (x,y) โดยที่� X’ = X x Sx
Y’ = Y x Sy
Fixed Point
distance
Fixed Point
distance
xx
yy
ในการก�าหนดิจ�ดิ (xp,yp) เป็�น fixed point ซึ่0"งไม�ไดิอย้��ที่!"จ�ดิ origin ม!ข$.นตำอนในการ scaling ดิ$งน!.
1. ย!ายจ ด (xp,yp) ไป็ที่� origin X’ = X - Xp, Y’ = Y - Yp
2. Scale จ ดโดยคำ2ณก�บ่ Sx, Sy X’’ = X’ x Sx, Y’’ = Y’ x Sy
3 . ย!ายจ ด (Xp,Yp) จาก origin สั่2 จ ดเด�ม X’’’ = X’’ + Xp, Y’’’ = Y’’ + Yp
แที่นคำ า X’,Y’,X’’,Y’’ ในสั่มการได! X’’’ = (X - Xp) x Sx + Xp Y’’’ = (Y - Yp) x Sy + Yp
2. Scaling
(xp,yp)
3. Translate
(xp,yp)
Object
(xp,yp)
1. Translate
(xp,yp)
SHEARINGSHEARING
เป็�นการเป็ล�ยนแป็ลงว�ตถุ ในล�กษณะเป็�นการเป็ล�ยนแป็ลงคำ าในด!าน x หร�อ y ด!านใดด!านหน6ง ม� 2 แบ่บ่คำ�อ x-shear และ y-shear
X-XXXXX เป็�นการเป็ล�ยนแป็ลงคำ าจากจ ด (x,y) เป็�น (x’,y’) โดยที่� X’ = X + shx . Y , Y’ = Y , shx 0
X-XXXXX เป็�นการเป็ล�ยนแป็ลงคำ าจากจ ด (x,y) เป็�น (x’,y’) โดยที่� X’ = X, Y’ = Y + shy . X , shy 0
X-shear
(1,0)
(1,1)(0,1)
(0,0) (0,0) (1,0)
(3,1)(2,1)
Y-shear
(1,0)
(1,1)(0,1)
(0,0) (0,0)
(1,2)
(0,1)
(1,3)
Inverse TransformationInverse Transformation
Translate : -H, -VRotate : -Scale : 1/Sx, 1/SyShear : -Shx, -Shy
MATRIX REPRESENTATION MATRIX REPRESENTATION OF TRANSFORMATIONSOF TRANSFORMATIONS
[ x’ y’ 1] = [ x y 1] 1 0 00 1 00 0 1
MATRIX REPRESENTATION MATRIX REPRESENTATION OF TRANSFORMATIONSOF TRANSFORMATIONS
TRANSLATIONTRANSLATION
[ x’ y’ 1] = [ x y 1] 1 0 00 1 0H V 1
MATRIX REPRESENTATION MATRIX REPRESENTATION OF TRANSFORMATIONSOF TRANSFORMATIONS
ROTATIONROTATION
[ x’ y’ 1] = [ x y 1] Cos Sin 0 -Sin Cos 0 0 0 1
MATRIX REPRESENTATION MATRIX REPRESENTATION OF TRANSFORMATIONSOF TRANSFORMATIONS
SCALINGSCALING
[ x’ y’ 1] = [ x y 1] Sx 0 00 Sy 00 0 1
MATRIX REPRESENTATION MATRIX REPRESENTATION OF TRANSFORMATIONSOF TRANSFORMATIONS
SHEARINGSHEARING
[ x’ y’ 1] = [ x y 1] 1 0 0Shx 1 0 0 0 1
X-Shear
[ x’ y’ 1] = [ x y 1] 1 Shy 0 0 1 0 0 0 1
Y-Shear
1 0 0 0 1 0-xp –yp 1
Scaling Relative to a Fixed Point
Sx 0 00 Sy 00 0 1
1 0 0 0 1 0xp yp 1
Sx 0 0 0 Sy 0(1-Sx)xp (1–Sy)yp
1
=
1 0 0 0 1 0-xp –yp 1
Rotation About a Pivot Point
1 0 0 0 1 0xp yp 1
=
Cos Sin 0 -Sin Cos 0 0 0 1
Cos Sin 0 -Sin Cos 0 (1-Cos)xp+ypsin (1-Cos)xp+ypsin 1
ReflectionReflection• reflect ก�บ่แกน x
[ x’ y’ 1] = [ x y 1] 1 0 00 -1 00 0 1
x
Y
X’ = xY’ = -y
ReflectionReflection• reflect ก�บ่แกน y
[ x’ y’ 1] = [ x y 1] -1 0 00 1 00 0 1
x
y
X’ = -xY’ = y
ReflectionReflection• reflect ก�บ่สั่!นตรง y= x
[ x’ y’ 1] = [ x y 1] 0 1 01 0 00 0 1
x
y
X’ = yY’ = x
2 D•Rotation
Composite Transformation
P11.Translate P1 to origin
2. Rotate
3. Translate Back to P1
T(x1,y1) . R() . T (-x1, -y1)
2 DComposite Transformation
Translate -> Rotate Rotate -> Translate
1 .จากจอภาพช่น�ดหน6ง ม�คำวามละเอ�ยด (resolution) 1024 x 768 จ ด และสั่ามารถุ แสั่ดงคำวามละเอ�ยดข้อง สั่�ได! 16.7 ล!านสั่� (24 bits) จะต!องใช่! memory ข้อง Video Card จ�านวนเที่ าใด อธิ�บ่ายและคำ�านวณพอเข้!าใจ
2. ร2ป็สั่�เหล�ยมจ�ต ร�สั่ร2ป็หน6ง ม�คำ า Coordinate ใน World Coordinates ด�งแสั่ดงข้!างล างน� ถุ2กแป็ลงร2ป็ (transform) ไป็โดยม�ข้�นตอนข้องการแป็ลงร2ป็ตามล�าด�บ่ต อไป็น� ก) ข้ยายร2ป็ (scaling) ให!โตข้6น 2 เที่ าข้องร2ป็เด�ม โดยม� fixed point อย2 ที่�จ ดศ2นย: กลางข้องร2ป็จ�ต ร�สั่ ข้) หม นร2ป็ (rotation) ไป็ 90 � ที่วนเข้-มนาฬิ�กา โดยม�จ ดหม น (pivot point) อย2 ที่�จ ดล างซ้!าย (bottom left) ข้องร2ป็จ�ต ร�สั่ที่�ได!จากข้!อ ก แล!ว อธิ�บ่ายหล�กการและว�ธิ�การ รวมที่�งเมตร�กซ้:ที่�ใช่!ในการ transform ด�งกล าว และคำ�านวณหาจ ดยอดที่�ได!หล�งจากการแป็ลงร2ป็แล!ว
(100,100) (200,100)
(200,200)(100,200)
3. จงแสั่ดงว�ธิ�การและคำ�านวณหา Coordinate ที่�ได!หล�งจากการ Mapping ร2ป็สั่ามเหล�ยมร2ป็หน6ง ซ้6งม�จ ดยอด (100,100), (800,400), (800,100) โดยก�าหนด window (0,1000,0,500) และก�าหนด viewport เป็�นNDC ที่�งหมด 5 viewport คำ�อ (0,1,0,1) , (0,1,0,0.5), (0,1,0.5,1), (0,0.5,0,1), (0.5,1,0,1)ให!ก�าหนด resolution ที่�เหมาะสั่มแล!วคำ�านวณหาจ ดที่�ได!ใน Screen Coordinate
(100,100) (200,100)
(200,200)(100,200)
(150,150)
1 0 0 0 1 0-xp –yp 1
Scaling Relative to a Fixed Point
Sx 0 00 Sy 00 0 1
1 0 0 0 1 0xp yp 1
Sx 0 0 0 Sy 0(1-Sx)xp (1–Sy)yp
1
=
Object
(xp,yp)
1. Translate
(xp,yp)
2. Scale
(xp,yp)
3. Translate
(xp,yp)
Sx 0 0 0 Sy 0(1-Sx)xp (1–Sy)yp
1
Sx = 2, Sy = 2,xp = 150, yp = 150
2 0 0 0 2 0-150 –150 1
2 0 0 0 2 0 -150 –150 1
[100 100 1]
[200 100 1]
[200 200 1]
[100 200 1]
[50 50 1]
[250 50 1]
[250 250 1]
[50 250 1]
=
(100,100) (200,100)
(200,200)(100,200)
(150,150)
(50,50) (250,50)
(50,250) (250,250)
ในการก�าหนดจ ด (xp,yp) เป็�น fixed point ซ้6งไม ได!อย2 ที่�จ ด origin ม�ข้�นตอนในการ scaling ด�งน�1. ย!ายจ ด (xp,yp) ไป็ที่� origin
X’ = X - Xp, Y’ = Y – Yp
(100,100) (-50,-50)(100,200) (-50,50)(200,200) (50,50)(200,100) (50,-50)
จากจ ด (x,y) เด�ม ถุ2กย!ายไป็ (-150,-150)
2. Scale จ ดโดยคำ2ณก�บ่ Sx, Sy
X’’ = X’ x Sx, Y’’ = Y’ x Sy
จากจ ด (x,y) เด�ม คำ2ณด!วย 2
(-50,-50) (-100,-100)
(50,-50) (100,-100)
(50,50) (100,100)
(-50,50) (-100,100)
3 . ย!ายจ ด (Xp,Yp) จาก origin สั่2 จ ดเด�ม
X’’’ = X’’ + Xp, Y’’’ = Y’’ + Yp
จากจ ด (x,y) เด�ม ถุ2กย!ายไป็ (150,150)
(-100,-100) (50,50)
(100,-100) (250,50)
(100,100) (250,250)
(-100,100) (50,250)
(50,50) (250,50)
(250,250)(50,250)
X
Y
1 0 0 0 1 0-xp –yp 1
Rotation About a Pivot Point
1 0 0 0 1 0xp yp 1
=
Cos Sin 0 -Sin Cos 0 0 0 1
Cos Sin 0 -Sin Cos 0 (1-Cos)xp+ypsin (1-Cos)yp-xpsin 1
Cos Sin 0 -Sin Cos 0 (1-Cos)xp+ypsin (1-Cos)yp-xpsin 1
0 1 0 -1 0 0 100 0 1
Sin 90= 1, cos 90 = 0, xp = 50, yp = 50
0 1 0 -1 0 0 100 0 1
[ 50 50 1]
[ 50 250 1]
[ 250 250 1]
[250 50 1]
[ 50 50 1]
[ -150 50 1]
[ -150 250 1]
[ 50 250 1]
จ ดยอดใหม ที่�ได! คำ�อ (50,50),(-150,50),(-150,250),(50,250)
(50,50) (250,50)
(250,250)(50,250)
Object
(50,250)
Translate
Rotate
(50,50)(-150,50)
(-150,250)
Translate
0 1000
0
500
0 1
0
1
(100,100) (800,100)
(400,400)
Window(0,1000,0,500)
Viewport(0,1,0,1)
Viewport(0,1,0,0.5)
0 1
0
0.5
0 10.5
1
Viewport(0,1,0.5,1)
0 0.5
0
1
Viewport(0,0.5,0,1)
0.5 1
0
1
Viewport(0.5,1,0,1)
(wx,wy) (vx,vy)wl vl
wh vhleft right
bottom
top
left right
bottom
top
(a,b) (a’,b’)
จ ด (a,b) ใน Window (a’,b’) ใน Viewport
(wx,wy) (vx,vy)wl vl
wh vhleft right
bottom
top
left right
bottom
top
(a,b) (a’,b’)
a’ – vx = a – wx vl wl a’ = (a–wx).vl + vx wl
b’ – vy = b – wy vh wh b’ = (b–wy).vh + vy wh
0 1000
0
500
0 500
500
1000
(100,100) (800,100)
(400,400)
Window(0,1000,0,500) Viewport(0,500,500,1000)
a’ – 0 = 100 – 0 b’ – 500 = 100 – 0 500 1000 500 500 a’ = 100 . 500 + 0 = 50 b’ = 100 . 500 + 500 = 600 1000 500
(100,100) (50,600)