418382...

138
418382 สสสสสสสสสสสสสส สสสสสสสสสสสสสสสสสสสสสสส สส สสสสสสสสสสสสสสสสส 3 สสสสสส สสสสสสส [email protected]

Upload: snowy

Post on 26-Jan-2016

79 views

Category:

Documents


0 download

DESCRIPTION

418382 สภาพแวดล้อมการทำงานคอมพิวเตอร์กราฟิกส์ การบรรยายครั้งที่ 3. ประมุข ขันเงิน [email protected]. การแปลงในสามมิติ. ในปริภูมิสามมิติ. พิกัดในสามมิติแทนด้วยลำดับ ( x , y , z ) หรือด้วย ( x , y , z , w ) ถ้าอยู่ในรูป homogeneous coordinate - PowerPoint PPT Presentation

TRANSCRIPT

418382 สภาพแวดล้อมการทำ�างานคอมพ�วเตอร�กราฟิ�กส�

การบรรยายคร��งทำ�� 3 ประม!ข ข�นเง�น

[email protected]

การแปลงในสามม�ติ�

ในปร�ภ$ม�สามม�ต�• พ�ก�ดในสามม�ต�แทำนดวยล้�าด�บ (x,y,z)• หร&อดวย (x,y,z,w) ถ้าอย$(ในร$ป homogeneous

coordinate • homogeneous coordinate (x,y,z,w) หมายถ้)ง

พ�ก�ด (x/w, y/w, z/w) ในปร�ภ$ม�สามม�ต�

ในปร�ภ$ม�สามม�ต� (ต(อ)

• พ�ก�ดในสามม�ต�สามารถ้เข�ยนไดอ�กแบบหน)�งในร$ป matrix

• ม�ความหมายเหม&อนก�บ homogeneous coordinate (x,y,z,1)

1

z

y

x

การแปล้งในปร�ภ$ม�สามม�ต�• การแปล้งแอฟิไฟิน�สามชน�ดทำ��เร�ยนผ่(านมา– การเล้&�อนแกนขนาน (translation)– การย(อขยาย (scaling)– การหม!น (rotation)

สามารถ้แทำนไดดวย matrix 4 ค$ณ 4

การเล้&�อนแกนขนาน• ส�ญล้�กษณ�• ส(งพ�ก�ด (x,y,z) ไปย�งพ�ก�ด (x+a, y+b, z+c)• ม� matrix เป0น

cbaT ,,

1000

100

010

001

c

b

a

การย(อขยายขนาด• ส�ญล้�กษณ�• ส(งพ�ก�ด (x,y,z) ไปย�งพ�ก�ด (ax, by, cz)• น��เป0นการย(อขยายรอบพ�ก�ด (0,0,0) เน&�องจาก

พ�ก�ด (0,0,0) ไม(เปล้��ยนแปล้ง• ม� matrix เป0น

cbaS ,,

1000

000

000

000

c

b

a

การหม!น• เวล้าหม!นจะตองบอกสองอย(าง– แกนทำ��จะใชหม!น– ม!มทำ��จะใชหม!น

• เวล้าระบ!แกนเราจะระบ!ดวยเวกเตอร� (a,b,c)• แกน ค&อเสนตรงทำ��เก�ดจากจ!ดทำ��งหมดทำ��อย$(ในร$ป (at,

bt, ct) เม&�อ t เป0นจ�านวนจร�งใดๆ• แกนจะผ่(านจ!ด (0,0,0) เสมอ• เวล้าทำ�าการหม!น จ!ดทำ��อย$(บนแกนจะไม(เคล้&�อนทำ��• ม!มทำ��จะใชหม!นส(วนใหญ(จะใชส�ญล้�กษณ� θ

การหม!นรอบแกน z

• แกน z ค&อเซตของพ�ก�ดต(างๆ ทำ��อย$(ในร$ป (0, 0, t)• สามารถ้ระบ!ไดดวยเวกเตอร� (0,0,1)• ส�ญล้�กษณ�• ส(งพ�ก�ด ไปย�งพ�ก�ด

1,0,0,R

1

z

y

x

1

cossin

sincos

z

yx

yx

การหม!นรอบแกน z (ต(อ)

• ม� matrix เป0น

1000

0100

00cossin

00sincos

การหม!นรอบแกน x

• แกน x ค&อเซตของพ�ก�ดต(างๆ ทำ��อย$(ในร$ป (t, 0, 0)• สามารถ้ระบ!ไดดวยเวกเตอร� (1,0,0)• ส�ญล้�กษณ�• ส(งพ�ก�ด ไปย�งพ�ก�ด

0,0,1,R

1

z

y

x

1

cossin

sincos

zy

zy

x

การหม!นรอบแกน x (ต(อ)

• ม� matrix เป0น

1000

0cossin0

0sincos0

0001

การหม!นรอบแกน y

• แกน z ค&อเซตของพ�ก�ดต(างๆ ทำ��อย$(ในร$ป (0, t, 0)• สามารถ้ระบ!ไดดวยเวกเตอร� (0,1,0)• ส�ญล้�กษณ�• ส(งพ�ก�ด ไปย�งพ�ก�ด

0,1,0,R

1

z

y

x

1

sincos

cossin

xz

y

xz

การหม!นรอบแกน y (ต(อ)

• ม� matrix เป0น

1000

0cos0sin

0010

0sin0cos

การหม!นรอบแกนใดๆ• ส�ญล้�กษณ�• ม� matrix เป0น

เม&�อ แล้ะ

cbaR ,,,

1000

0)1()1()1(

0)1()1()1(

0)1()1()1(

2

2

2

CCcaSCcbbSCca

aSCbcCCbcSCba

bSCaccSCabCCa

cosC sinS

การแปล้ง affine

• การแปล้ง affine ค&อการแปล้งทำ��สามารถ้เข�ยนอย$( ในร$ป matrix

1000

nkfc

mjeb

lida

ระบบพ�ก�ด• ระบบพ�ก�ดเป0นต�วก�าหนดว(าพ�ก�ดใดแทำนจ!ดใด• พ�ก�ดแล้ะจ!ด?– พ�ก�ดค&อล้�าด�บของเล้ขสามต�ว: (x,y,z)– จ!ดค&อจ!ดทำ��เราเห4นดวยตา

• ระบบพ�ก�ดในสามม�ต�ม�ส(วนประกอบอย$(สามส(วน– จ!ดออร�จ�น o: จ!ดน��จะแทำนดวยพ�ก�ด (0,0,0) ในระบบ

พ�ก�ด– เวกเตอร�สามต�ว i, j, แล้ะ k ส�าหร�บก�าหนดทำ�ศทำางแกน

x, y, แล้ะ z ตามล้�าด�บ

ระบบพ�ก�ด (ต(อ)

• พ�ก�ด (x,y,z) ในระบบพ�ก�ดน��จ)งหมายถ้)งจ!ดo + xi + yj + zk

กล้(าวค&อม�นค&อจ!ดทำ��อย$(ห(างจากจ!ด o ไปตามแนวเวกเตอร� i เป0นระยะ x เทำ(าของความ

ยาวเวกเตอร� I ไปตามแนวเวกเตอร� j เป0นระยะ y เทำ(าของความ

ยาวเวกเตอร� j ไปตามแนวเวกเตอร� k เป0นระยะ z เทำ(าของความ

ยาวเวกเตอร� k

ระบบพ�ก�ด• เข�ยนไดอ�กแบบหน)�งว(าพ�ก�ด (x,y,z) หมายถ้)งจ!ด

1

z

y

x

okji

ระบบพ�ก�ดก�บการแปล้ง• พ�จารณาการแปล้ง affine

1000

nkfc

mjeb

lida

M

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

• ม�นส(งพ�ก�ด ไปย�งพ�ก�ด

1

z

y

x

1

nkzfycx

mjzeybx

lizdyax

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

• พ$ดไดอ�กอย(างหน)�งค&อ M ส(งจ!ด

ไปย�งจ!ด

1

z

y

x

okji

110001

z

y

x

nkfc

mjeb

lida

nkzfycx

mjzeybx

lizdyax

okjiokji

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

• แต(เราอาจมองไดอ�กว(า

ม�ค(าเทำ(าก�บ

11000

z

y

x

nkfc

mjeb

lida

okji

1

z

y

x

nmlokjifedcba kjikjikjikji

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

• ด�งน��นการแปล้ง M จ)งสามารถ้มองไดว(าเป0นการเปล้��ยนระบบพ�ก�ดจากระบบพ�ก�ดทำ��– ม� o เป0นจ!ดออร�จ�น– ม� i เป0นต�วก�าหนดทำ�ศทำางแกน x– ม� j เป0นต�วก�าหนดทำ�ศทำางแกน y– ม� k เป0นต�วก�าหนดทำ�ศทำางแกน zเป0นระบบพ�ก�ดทำ��– ม� o+li+mj+nk เป0นจ!ดออร�จ�น– ม� ai+bj+ck เป0นต�วก�าหนดทำ�ศทำางแกน x– ม� di+ej+fk เป0นต�วก�าหนดทำ�ศทำางแกน y– ม� ii+jj+kk เป0นต�วก�าหนดทำ�ศทำางแกน z

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

• หร&อกล้(าวไดอ�กอย(างหน)�งค&อ– จ!ดออร�จ�นใหม(ค&อจ!ดทำ��ม�พ�ก�ด (l,m,n) ในระบบพ�ก�ดเด�ม– เวกเตอร�แกน x ใหม( ค&อเวกเตอร� (a,b,c) ในระบบพ�ก�ด

เด�ม– เวกเตอร�แกน y ใหม( ค&อเวกเตอร� (d,e,f) ในระบบพ�ก�ด

เด�ม– เวกเตอร�แกน z ใหม( ค&อเวกเตอร� (i,j,k) ในระบบพ�ก�ด

เด�ม

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

1000

nkfc

mjeb

lida

แกน x ใหม�

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

1000

nkfc

mjeb

lida

แกน y ใหม�

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

1000

nkfc

mjeb

lida

แกน z ใหม�

ระบบพ�ก�ดก�บการแปล้ง (ต(อ)

1000

nkfc

mjeb

lida

จุ�ด origin ใหม�

Homogeneous Coordinate ก�บเวกเตอร�

• Homogeneous coodinate สามารถ้ใชแทำนไดทำ��งจุ�ดแล้ะเวกเติอร�

• ถ้า w ใน (x,y,z,w) เป0น 1 แสดงว(าม�นแทำนจ!ด– ถ้าม�นไม(ใช( 1 ใหเอา w ไปหาทำ!กต�วเพ&�อทำ�าใหม�นเป0น 1

เส�ย• ถ้า w ใน (x,y,z,w) เป0น 0 แสดงว(าม�นแทำนเวกเตอร�

(ทำ�ศทำาง)

จ!ดก�บเวกเตอร�• “ ”จ!ด ค&อ ต�าแหน(ง• “ ”เวกเตอร� ค&อ ทำ�ศทำาง• ค!ณเอาเวกเตอร�สองเวกเตอร�มาบวกก�นได

1v

2v

213 vvv

จ!ดก�บเวกเตอร� (ต(อ)

• แต(ค!ณเอาจ!ดสองจ!ดมาบวกก�นไม(ได

• แต(เอาจ!ดมาบวกก�นเวกเตอร�ได จะไดจ!ดอ�กจ!ดหน)�ง

1p2p ???21 pp

1p

2pv 21 pvp

จ!ดก�บเวกเตอร� (ต(อ)

• ในทำ�านองเด�ยวก�น ค!ณสามารถ้หาผ่ล้ต(างของจ!ด ได ซ)�งจะไดผ่ล้ล้�พธ์�ออกมาเป0นเวกเตอร�

• ยกต�วอย(างเช(น1p

2pv 21 pvp

0

3

2

0

1

1

2

3

1

5

4

3

จ!ดก�บเวกเตอร� (ต(อ)

• การแปล้ง affine ม�ผ่ล้ต(อจ!ดแล้ะเวกเตอร�ต(างก�น

แต(

1

)(

)(

)(

11000

nkzfycx

mjzeybx

lizdyax

z

y

x

nkfc

mjeb

lida

001000

kzfycx

jzeybx

izdyax

z

y

x

nkfc

mjeb

lida

จ!ดก�บเวกเตอร� (ต(อ)

• ให– M เป0นการแปล้ง affine– p เป0นจ!ด– ให v เป0นเวกเตอร�

• ไดว(า– Mp เป0นจ!ด– Mv เป0นเวกเตอร�

• ในการแปล้งจ!ดจะม�การเล้&�อนแกนขนานต�ดมาดวย• แต(ในการแปล้งเวกเตอร� จะไม(ม�การเล้&�อนแกนขนานต�ด

มาดวย

TRANSFORMATIONS IN THE GRAPHICS PIPELINE

OpenGL Vertex Transformations

• ล้�าด�บของ transform ทำ�� vertex หน)�งจะตองผ่(านไป ก(อนทำ��ม�นจะถ้$กเปล้��ยนเป0น fragment

OpenGL Vertex Transformation (ต(อ)

1

Transform

Model

Transform

View

Transform

Projection

Divide

ePerspectiv

Transform

Viewport

1

0 o

o

o

w

w

z

y

x

y

x

Modeling Transform

• Object space ค&อระบบพ�ก�ดทำ��ศ�ล้ป�นทำ�าการข)�นโมเดล้มาให

• World space ค&อระบบพ�ก�ดกล้างของฉากทำ��โมเดล้ หล้ายๆ โมเดล้มาอย$(ร (วมก�น

• Modeling transform ทำ�าหนาทำ��เปล้��ยน vertex จาก ทำ��อย$(ใน object space มาอย$(ใน world space

• ในขณะเด�ยวก�นม�นอาจจะเปล้��ยนแปล้งหนาตาหร&อทำ(าทำางของโมเดล้ไดดวย

Modeling Transform (ต(อ)

View Transform

• View transform ใชในการเซตม!มกล้อง• Eye space ค&อระบบพ�ก�ดทำ��– ตาเราอย$(ทำ��จ!ด (0,0,0)– เรามองไปในทำ�ศทำางแกน z ทำางล้บ (ในทำ�ศทำางของเวก

–เตอร� k)– ทำ�ศทำางแกน y “ ”ค&อ ดานบน

• View transform เปล้��ยน vertex ทำ��อย$(ใน world space มาอย$(ใน eye space

View Transform (ต(อ)

View Transform (ต(อ)

x

y

z

x

ylookatpoint

eyepoint

Modelview Matrix

• OpenGL รวมข��นตอนการทำ�า modeling transform แล้ะ view transform เขาดวยก�นเป0นข��นตอนเด�ยว

• แทำนการแปล้งจาก object space ไปเป0น eye space ดวย modelview matrix

ModelViewModelview

การจ�ดการก�บ Modelview Matrix

• เปล้��ยน mode ของ matrix เป0น modelview matrix ดวยค�าส��งglMatrixMode(GL_MODELVIEW)

• หล้�งจากน��นใชค�าส��งอ&�นๆ– glLoadIdentity– glTranslate[fd]– glScale[fd]– glRotate[fd]– glMultMatrix[fd]

ค�าส��งเก��ยวก�บ matrix

• glLoadIdentity()– ทำ�าใหค(าของ matrix ใน mode ป9จจ!บ�นทำ�� OpenGL จ�าไว

เป0น identity matrix• glTranslate[fd](a,b,c)– สมมต�ว(า matrix ใน mode ป9จจ!บ�นค&อ M– ค�าส��งน��จะทำ�าให matrix ป9จจ!บ�นกล้ายเป0น MTa,b,c

• glScale[fd](a,b,c)– ค�าส��งน��จะทำ�าให matrix ป9จจ!บ�นกล้ายเป0น MSa,b,c

ค�าส��งเก��ยวก�บ matrix (ต(อ)

• glRotate[fd](a, x, y, z)– a ค&อ ม!มทำ��จะหม!น หน(วยเป0นองศา (ไม(ใช(เรเด�ยน!)– x, y, แล้ะ z ระบ!แกนทำ��จะหม!น– ค�าส��งน��จะทำ�าให matrix ป9จจ!บ�นกล้ายเป0น MRa,x,y,z

ค�าส��งเก��ยวก�บ matrix (ต(อ)

• glMultMatrix[fd](m)– m ค&อ list ของเล้ข 16 ต�ว– สมมต�ว(าให m = [a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p]– ค�าส��งน��จะทำ�าให matrix ป9จจ!บ�นกล้ายเป0น

plhd

okgc

njfb

miea

M

LookAt Transform

• การเซตม!มกล้องอย(างง(ายแบบหน)�ง• บอก– eye = ต�าแหน(งของตา– at = ต�าแหน(งทำ��ตามอง– up = ทำ�ศทำางดานบน

การเปล้��ยนระบบพ�ก�ดของ LookAt Transform

x

y

zx

y

z

atpoint

eyepointEye Space

WorldSpace

up

gluLookAt

• gluLookAt(eyeX, eyeY, eyeZ, atX, atY, atZ, upX, upY, upZ)– ค$ณ matrix ของ mode ป9จจ!บ�นดวย matrix ทำ��

transform ระบบพ�ก�ดโดยทำ�าให• จ!ด (0,0,0) ในระบบพ�ก�ดใหม(ค&อจ!ด eye• –ทำ�ศทำาง z ของระบบพ�ก�ดใหม(ค&อทำ�ศทำางจากจ!ด eye ไปย�ง

จ!ด at– กล้(าวค&อแกน z ม�ทำ�ศทำางเด�ยวก�บเวกเตอร� eye – at

• ทำ�ศทำางของแกน y จะคล้ายๆ ก�บทำ�ศทำาง up

ต�วอย(าง• ตองการเซตม!มกล้องใหกล้องอย$(ทำ��จ!ด (-5,-5,-5)

แล้วมองไปทำ��จ!ด (0,0,0) แล้ะม�เวกเตอร� (1,-1,0) เป0นดานบน

glMatrixMode(GL_MODELVIEW);glLoadIdentity();gluLookAt(-5,-5,-5,0,0,0,1,-1,0);(วาดร$ปอะไรอย(างอ&�นต(อไป)

Projection Transformation

• เปล้��ยน eye space เป0น clip space• พ�ก�ดใน clip space จะใชเป0นต�วบอกว(าเราจะเห4น

vertex ใดหร&อไม(เห4น vertex ใด• กระบวนการต�ดส�นใจ: vertex ทำ��เห4นจะตองม�– -1 ≤ x ≤ 1– -1 ≤ y ≤ 1– -1 ≤ z ≤ 1

• Projection transform ย�งม�ผ่ล้ต(อล้�กษณะภาพทำ��เราเห4นอ�กดวย

Projection Transform ใน OpenGL

• OpenGL จะจ�า matrix ของ projection transform เอาไว• เวล้าตองการเปล้��ยนแปล้ง projection matrix ใหเปล้��ยน

mode ของ matrix เป0น GL_PROJECTION ดวยค�าส��งglMatrixMode(GL_PROJECTION);

• หล้�งจากน��นใชค�าส��งในการเปล้��ยนแปล้ง matrix อ&�นแบบ เด�ม เช(น glLoadIdentity(), glMultMatrix(…), ฯล้ฯ

• ส(วนมากเราจะส��ง glLoadIdentity() ทำ�นทำ�หล้�งจากส��งglMatrixMode(GL_PROJECTION) เสร4จแล้ว เพ&�อเคล้�ยร�

ค(า projection matrix ก(อนใส(ค(าใหม(

Projection Transformation ทำ��ส�าค�ญ 2 แบบ

• Orthographic Projection• Perspective Projection

Orthographic Projection

• ปร�มาตรของบร�เวณทำ��เห4นเป0นปร�ซ)ม• ไม(ม� foreshortening กล้(าวค&อ ไม(ว(าว�ตถ้!จะอย$(ใกล้

ไกล้ก4เห4นขนาดเทำ(าก�นหมด• หล้�งจากฉาก เสนขนานย�งเป0นเสนขนานอย$(• ใชในโปรแกรมช(วยเข�ยนแบบ/CAD เน&�องจากขนาด

ของว�ตถ้!เป0นเร&�องส�าค�ญ

Orthographic Projection (ต(อ)

http://www2.arts.ubc.ca/TheatreDesign/crslib/drft_1/orthint.htm

Orthographic Projection (ต(อ)

http://www2.arts.ubc.ca/TheatreDesign/crslib/drft_1/cad/wdstv.htm

การน�ยาม Orthographic Projection

• น�ยามไดโดยการน�ยามปร�ซ)มของปร�มาตรทำ��เราตองการมองเห4น

• ปร�ซ)มน��สามารถ้น�ยามไดดวยต�วเล้ข 3 ค$(– left แล้ะ right --- ขอบเขตในแนวแกน x– top แล้ะ bottom --- ขอบเขตในแนวแกน y– near แล้ะ far --- ขอบเขตในแนวแกน -z ( เพราะเรามองในแนว -z)

• ค(าทำ��งหกเป0นพ�ก�ดใน eye space• ปร�ซ)มทำ��น�ยามค&อ

{(x,y,z) : left ≤ x ≤ right, top ≤ y ≤ bottom, near ≤ -z ≤ far}

ปร�ซ)มปร�มาตรทำ��มองเห4น

การน�ยาม Orthographic Projection (ต(อ)

• Matrix ของ orthographic projection ตองทำ�าอะไรบา– ส(ง x = left ไป x = -1– ส(ง x = right ไป x = 1– ส(ง y = bottom ไป y = -1– ส(ง y = top ไป y = 1– ส(ง z = -far ไป z = 1– ส(ง z = -near ไป z = -1

Matrix ของ Orthographic Projection

1000

200

02

0

002

nf

nf

nf

bt

bt

bt

lr

lr

lr

ค�าส��ง OpenGL เก��ยวก�บOrthographic Projection

• glOrtho(left, right, bottom, top, near, far)– ค$ณ matrix ป9จจ!บ�นดวย matrix ของ orthographic

projection ในหนาก(อน– ก(อนใชควรเร�ยก

glMatrixMode(GL_PROJECTION)glLoadIdentity()

ก(อนเพ&�อเปล้��ยน mode แล้ะเคล้�ยร�ค(า projection matrix เด�ม

• glOrtho2D(left, right, bottom, top)– เหม&อนก�บ glOrtho แต(ใหค(า near เป0น 0 แล้ะ ค(า far เป0น 1

Perspective Projection

• ปร�มาตรของบร�เวณทำ��เห4นเป0น frustum (ป;ระม�ดยอดต�ด)

• ม� foreshortening กล้(าวค&อ อะไรทำ��อย$(ใกล้จะเห4นใหญ(กว(า

• หล้�งจากฉายแล้ว เสนขนานอาจจะไม(ขนานก�นเหม&อนเด�ม

• ใหความเป0นสามม�ต� เพราะเหม&อนก�บทำ��ตาคน ทำ�างาน ทำ�าใหเหม&อนเขาไปอย$(ในฉากจร�งๆ

• ใชก�บโปรแกรมทำางความบ�นเทำ�ง

Perspective Projection (ต(อ)

Perspective Projection (cont.)

orthographic perspective

การน�ยาม Perspective Projection

• น�ยามดวยเล้ข 6 ต�วเหม&อนก�บ orthographic projection

การน�ยาม Perspective Projection (ต(อ)

• ปร�มาตรทำ��มองเห4นค&อป;ระม�ดยอดต�ดทำ��ม�ยอดเป0นส��เหล้��ยม{(x,y,z) : left ≤ x ≤ right, bottom ≤ y ≤ top,

z = -near} ซ)�งยอดของม�นถ้$กฉายต(อไปจนถ้)ง z = -far

การน�ยาม Perspective Projection (ต(อ)

• ใหจ!ด (x,y,z) มาใน eye space แล้วม�นจะถ้$กแปล้ง เป0นอะไรใน clip space?

nzeye

fzeye

1clipx

lxeye

zzeye

(0,0,0)

rxeye

1clipx

(x,y,z)

การน�ยาม Perspective Projection (ต(อ)

• หา x ใน clip space

nzeye

fzeye

1clipx

lxeye

zzeye

(0,0,0)

rxeye

1clipx

(x,y,z)

???clipx

การน�ยาม Perspective Projection (ต(อ)

• เร��มจากการหา x ใน eye space ของจ!ดปล้ายสองจ!ด

nzeye

fzeye

1clipx

lxeye

zzeye

(0,0,0)

rxeye

1clipx

(x,y,z)

???clipx

???, righteyex???, lefteyex

การน�ยาม Perspective Projection (ต(อ)

• อาศ�ยความร$ เร&�องสามเหล้��ยมคล้าย ไดว(าด�งน��น

???, righteyex

rxeye

nzeye

zzeye

(0,0,0)

n

z

r

x righteye

,

n

zrx righteye ,

การน�ยาม Perspective Projection (ต(อ)

• ทำ�านองเด�ยวก�น ด�งน��น

nzeye

lxeye

zzeye

(0,0,0)

???, lefteyex

n

z

l

x lefteye

,

n

zlx lefteye ,

การน�ยาม Perspective Projection (ต(อ)

• เราร$ ว(า ส�าหร�บค(าคงทำ�� a แล้ะ b บางต�ว

1clipx

zzeye

(0,0,0)

1clipx

(x,y,z)

???clipx

n

zrx righteye ,

n

zlx lefteye ,

baxxclip

การน�ยาม Perspective Projection (ต(อ)

• เน&�องจากถ้า x = -zl/n แล้ว xclip = -1

แล้ะถ้า x = -zr/n แล้ว xclip = 1• ไดว(า

• เม&�อแกสมการออกมาจะไดว(า

bn

zra

bn

zla

1

1

lr

lrb

zlr

na

)(

2

การน�ยาม Perspective Projection (ต(อ)

• กล้(าวค&อ

• ในทำ�านองเด�ยวก�นเราก4จะไดว(าlr

lrxzlr

nxclip

)(

2

bt

btyzbt

nyclip

)(

2

การน�ยาม Perspective Projection (ต(อ)

• แล้ว zclip ควรจะม�ค(าเทำ(าไหร(?• ค(า zclip “ ” จะถ้$กใชเป0น ความล้)ก ของ fragment

• zclip จะตองม�ค!ณสมบ�ต�สองประการ– ถ้า z นอย zclip ก4ตองนอยตามไปดวย– perspective matrix จะตองส(งเสนตรงไปย�งเสนตรง

• ต�วอย(าง zclip ทำ��ใชไม(ได– zclip=z–

222 zyxzclip

การน�ยาม Perspective Projection (ต(อ)

• zclip ทำ�� OpenGL ใชม�ร$ป

• เน&�องจาก zclip= -1 ถ้า z = -n

แล้ะ zclip= 1 ถ้า z = -f

จะไดว(า

z

BAzclip

f

BA

n

BA

1

1

การน�ยาม Perspective Projection (ต(อ)

• เม&�อแกสมการออกมาแล้วจะไดว(า

• กล้(าวค&อnf

nfA

nf

fnB

2

znf

fn

nf

nfzclip )(

2

การน�ยาม Perspective Projection (ต(อ)

• กล้(าวค&อ perspective projection matrix จะตองส(ง

1

z

y

x

znf

fnz

nf

nf

zbt

bty

bt

n

zlr

lrxlr

n

znf

fn

nf

nfbt

btyzbt

nlr

lrxzlr

n

2

2

2

1)(

2)(

2)(

2

ไปย�ง

Matrix ของ Perspective Projection

0100

200

02

0

002

nf

fn

nf

nfbt

bt

bt

nlr

lr

lr

n

ค�าส��ง OpenGL เก��ยวก�บPerspective Projection

• glFrustum(left, right, bottom, top, near, far)– ค$ณ matrix ป9จจ!บ�นดวย matrix ของ perspective

projection ในหนาก(อน– ก(อนใชควรเร�ยก

glMatrixMode(GL_PROJECTION)glLoadIdentity()

ก(อนเพ&�อเปล้��ยน mode แล้ะเคล้�ยร�ค(า projection matrix เด�ม

ค�าส��ง OpenGL เก��ยวก�บPerspective Projection (ต(อ)

• gluPerspective(fovy, aspect, near, far)– ค$ณ matrix ป9จจ!บ�นดวย perspective projection

matrix เช(นเด�ยวก�บ glFrustrum– ม�ผ่ล้เหม&อนก�บส��ง glFrustum โดยได• top = near * tan(fovy / 2)• bottom = -top• right = aspect * top• left = -right

ค�าส��ง OpenGL เก��ยวก�บPerspective Projection (ต(อ)

– fovy ย(อมาจาก field of view Y หมายถ้)งความกวาง ของม!มมองตามแนวแกน y (ม�หน(วยเป0นองศา)

– aspect ค&อ aspect ratio ของหนาต�ดของป;ระม�ด– ป;ระม�ดทำ�� gluPerspective สรางม�หนาตาเป0นด�งขาง

ล้(าง

ค�าส��ง OpenGL เก��ยวก�บPerspective Projection (ต(อ)

• ส�งเกตว(าค�าส��ง glFrustum สามารถ้สรางป;ระม�ดทำ�� ไม(สมมาตรรอบแกน z ได

• แต(ป;ระม�ดทำ��สรางดวย gluPerspective จะเป0นป;ระ ม�ดทำ��สมมาตรรอบแกน z เสมอ

TRANSFORMATIONS IN MODELING

การแปล้งก�บการวาดภาพ• การแปล้งสามารถ้น�ามาใชสรางภาพทำ��ม�ความซ�บ

ซอนไดมากมาย• เราจะมาด$ต�วอย(างการสราง แฟรกติ�ล (fractal)– ร$ปทำ��พอเอาแว(นขยายส(องด$แล้วเห4นเป0นล้�กษณะ

เหม&อนก�บตอนไม(ไดใชแว(นขยายด$

Sierpinski Triangle

Sierpinski Triangle

• เพ&�อความง(ายในการสราง เราจะแบ(ง Sierpinski triangle ออกเป0นช��นๆ

• ช��นทำ�� 0 เป0นสามเหล้��ยมดานเทำ(าธ์รรมดา

Sierpinski Triangle

• ช��นทำ�� 1 เก�ดจากการเอา Sierpiński triangle ช��นทำ�� 0 ทำ��ย(อส(วนล้งสองเทำ(ามาเร�ยงก�นตามร$ปขางล้(างน��

Sierpinski Triangle

• Sierpiński Triangle ช��นทำ�� 2 เก�ดจากการเอาSierpiński triangle ช��นทำ�� 1 ทำ��ย(อส(วนล้งสองเทำ(ามาเร�ยงก�นตามร$ปขางล้(างน��

Sierpinski Triangle

• Sierpiński Triangle ช��นทำ�� 3 เก�ดจากการเอาSierpiński triangle ช��นทำ�� 2 ทำ��ย(อส(วนล้งสองเทำ(ามาเร�ยงก�นตามร$ปขางล้(างน��

Sierpinski Triangle

• Sierpiński Triangle ช��นทำ�� k เก�ดจากการเอาSierpiński triangle ช��นทำ�� k-1 ทำ��ย(อส(วนล้งสองเทำ(ามาเร�ยงก�นตามร$ปเด�ม

• ขางล้(างน��ค&อ Sierpiński triangle ประมาณช��นทำ�� 8

เราจะวาด Sierpinski Triangle ไดอย(างไร?

• เข�ยนฟิ9งก�ช�น void draw_sierpinski(int k) ทำ��ทำ�าการวาด Sierpinski Triangle ช��นทำ�� k

• ม�กฎอย$(สองขอในการวาด Sierpinski Triangle– ถ้า k = 0 ใหวาดสามเหล้��ยมดานเทำ(า– ถ้า k > 0 ใหวาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

เร�ยงก�นตามร$ปทำ��เราเคยเห4นมา

วาดสามเหล้��ยมดานเทำ(า• ตองการวาดสามเหล้��ยมดานเทำ(าความยาวดานล้ะ 1

หน(วย• จ!ดศ$นย�กล้าง ( จ!ด centroid) อย$(ทำ��จ!ด (0,0)¡

0; 1p3

¢

¡12; 1

2p

3

¢¡¡ 1

2; 12p

3

¢

วาดสามเหล้��ยมดานเทำ(าvoid draw_triangle(){glBegin(GL_LINE_LOOP);

glVertex2d( 0.0, 1.0/sqrt(3.0));glVertex2d( 0.5, -0.5/sqrt(3.0));glVertex2d(-0.5, -0.5/sqrt(3.0));

glEnd();}

ผ่ล้ล้�พธ์�

ฟิ9งก�ช�น draw_sierpinski

void draw_sierpinski(int k){if (k == 0)draw_triangle();else{// วาด Sierpinski triangle// ช��นทำ�� k-1 สามอ�น}

}

วาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

• วาดอย(างไร?– เร�ยก draw_sierpinski(k-1)

• วาดตรงไหน?centroid =

¡0; 1

2p

3

¢

centroid =¡

14; ¡ 1

4p

3

¢centroid =

¡¡ 1

4;¡ 14p

3

¢

วาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

• วาด Sierpinski Triangle อ�นบน– Translate centroid ไปเป0นจ!ด– Scale ขนาดล้ดล้ง 2 เทำ(า (= ขยาย 0.5 เทำ(า)

• วาด Sierpinski Triangle อ�นล้(างขวา– Translate centroid ไปเป0นจ!ด– Scale ขนาดล้ดล้ง 2 เทำ(า (= ขยาย 0.5 เทำ(า)

• วาด Sierpinski Triangle อ�นล้(างซาย– Translate centroid ไปเป0นจ!ด– Scale ขนาดล้ดล้ง 2 เทำ(า (= ขยาย 0.5 เทำ(า)

¡0; 1

2p

3

¢

¡14;¡ 1

4p

3

¢

¡¡ 1

4; ¡ 14p

3

¢

วาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

void draw_sierpinski(int k){

if (k == 0)draw_triangle();

else{

glLoadIdentity();glTranslated(0.0, 0.5 / sqrt(3.0), 0.0);glScaled(0.5, 0.5, 0.5);draw_sierpinski(k-1);

glLoadIdentity();glTranslated(0.25, -0.25 / sqrt(3.0), 0.0);glScaled(0.5, 0.5, 0.5);draw_sierpinski(k-1);

glLoadIdentity();glTranslated(-0.25, -0.25 / sqrt(3.0), 0.0);glScaled(0.5, 0.5, 0.5);draw_sierpinski(k-1);

}}

วาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

• draw_siepinski(0)

วาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

• draw_siepinski(1)

วาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

• draw_siepinski(2)

วาด Sierpinski Triangle ช��นทำ�� k-1 สามอ�น

• draw_siepinski(2)

???

เก�ดอะไรข)�น?

ระบบพ�ก�ดส�าหร�บวาด Siepinski triangle ระด�บ k = I

เก�ดอะไรข)�น?

ระบบพ�ก�ดส�าหร�บวาดSiepinski triangle บน ค&อ TUS0.5 =MU

ระบบพ�ก�ดส�าหร�บวาดSiepinski triangle ขวา ค&อ TRS0.5 =MR

ระบบพ�ก�ดส�าหร�บวาดSiepinski triangle ซาย ค&อ TLS0.5 =ML

เก�ดอะไรข)�น?

MUMU

MUMRMUML

MLMU

MLMRMLML

MRMU

MRMRMRML

พ�จารณา code ใหม(อ�กคร��งMODELVIEW = M

glLoadIdentity(); MODELVIEW = IglTranslated(...); MODELVIEW = TglScaled(...); MODELVIEW = TSdraw_sierpinski(k-1);

MODELVIEW = ???glLoadIdentity(); MODELVIEW = IglTranslated(...); MODELVIEW = TglScaled(...); MODELVIEW = TSdraw_sierpinski(k-1);

พ�จารณา code ใหม(อ�กคร��งMODELVIEW = M

glLoadIdentity(); MODELVIEW = IglTranslated(...); MODELVIEW = TglScaled(...); MODELVIEW = TSdraw_sierpinski(k-1);

MODELVIEW = ???glLoadIdentity(); MODELVIEW = IglTranslated(...); MODELVIEW = TglScaled(...); MODELVIEW = TSdraw_sierpinski(k-1);

ความจุร�งแล�ว MODELVIEW ควรม�ค�าเท่�าก�บ MTS!!!

พ�จารณา code ใหม(อ�กคร��งMODELVIEW = M

glLoadIdentity(); MODELVIEW = IglTranslated(...); MODELVIEW = TglScaled(...); MODELVIEW = TSdraw_sierpinski(k-1); MODELVIEW = ???

MODELVIEW = ???glLoadIdentity(); MODELVIEW = IglTranslated(...); MODELVIEW = TglScaled(...); MODELVIEW = TSdraw_sierpinski(k-1); MODELVIEW = ???

ติรงจุ�ดสองจุ�ดน�� MODELVIEW ควรม�ค�าเท่�าก�บ M

แล้วจะตองทำ�าอะไร?

• ก(อนส��ง glTranslated(…) ตองม�การจ�าค(าเมตร�กซ�MODELVIEW อ�นเด�มเอาไว

• หล้�งเร�ยก draw_sierpinski(…) ตองม�การเอาค(าMODELVIEW อ�นเด�มค&นกล้�บมา

glPushMatrix() แล้ะ glPopMatrix()

• glPushMatrix()– ทำ�าการ push ค(าของเมตร�กซ�ใน mode ป9จจ!บ�นล้ง

stack• glPopMatrix()– pop stack ทำ��เก4บค(าเมตร�กซ�เอาไวแล้วน�าค(าทำ��ไดไปให

• “ ” เราสามารถ้ใชฟิ9งก�ช�นสองฟิ9งก�ช�นน��ในการ จ�าtransform ได

เข�ยนใหม(MODELVIEW = M

glPushMatrix(); MODELVIEW = M (จ�า)glTranslated(...); MODELVIEW = MTglScaled(...); MODELVIEW = MTSdraw_sierpinski(k-1); MODELVIEW = ???glPopMatrix(); MODELVIEW = M

glPushMatrix(); MODELVIEW = M (จ�า)glTranslated(...); MODELVIEW = MTglScaled(...); MODELVIEW = MTSdraw_sierpinski(k-1); MODELVIEW = ???glPopMatrix(); MODELVIEW = M

ทำ��งฟิ9งก�ช�นvoid draw_sierpinski(int k){

if (k == 0)draw_triangle();

else{

glPushMatrix();glTranslated(0.0, 0.5 / sqrt(3.0), 0.0);glScaled(0.5, 0.5, 0.5);draw_sierpinski(k-1);glPopMatrix();

glPushMatrix();glTranslated(0.25, -0.25 / sqrt(3.0), 0.0);glScaled(0.5, 0.5, 0.5);draw_sierpinski(k-1);glPopMatrix();

glPushMatrix();glTranslated(-0.25, -0.25 / sqrt(3.0), 0.0);glScaled(0.5, 0.5, 0.5);draw_sierpinski(k-1);glPopMatrix();

}}

ผ่ล้ล้�พธ์�• draw_sierpinski(2)

ผ่ล้ล้�พธ์�• draw_sierpinski(3)

ผ่ล้ล้�พธ์�• draw_sierpinski(4)

ผ่ล้ล้�พธ์�• draw_sierpinski(8)

HIERARCHICAL SCENE ORGANIZATION

การจ�ดฉาก• ฉากประกอบดวยว�ตถ้!หล้ายๆ อย(าง• ศ�ล้ป�นสรางว�ตถ้!แต(ล้ะช��นข)�นมาใน object space

ของม�นเอง• ว�ตถ้!แต(ล้ะว�ตถ้!จะตองถ้$กแปล้งจากทำ��อย$(ใน object

space ใหมาอย$(ใน world space

ต�วอย(างฉาก

ภาพจาก Durand and Cutler, 6.837 Fall 2003 Lecture Note: Transformations 2: In Modeling

ฉากต�วอย(าง

(0,0)

x=0 x=2x=-2

y=0

y=-1

y=1.2

ว�ตถ้!• สมมต�ว(าศ�ล้ป�นสรางว�ตถ้!ใหเรามาสองอย(าง– Circle: วงกล้มร�ศม�หน)�งหน(วยทำ��ม�จ!ดศ$นย�กล้างอย$(ทำ��จ!ด

(0,0)– Square: ส��เหล้��ยมจ�ต!ร�สทำ��ม�จ!ดม!มล้(างซายอย$(ทำ��จ!ด (-1,-

1) แล้ะม!มบนขวาอย$(ทำ�� (1,1)• เราจะสรางฉากทำ��เห4นในสไล้ด�ทำ��แล้วอย(างไร?y

x-2

-1 12

1

2

-1

-2

y

x-2

-1 12

1

2

-1

-2

การจ�ดฉากแบบเป0นล้�าด�บข)�น• เวล้าจ�ดฉากเราม�กจะแบ(งม�นเป0นล้�าด�บข��น

ฉาก

เกาอ�� โต=ะแล้ะถ้าดผ่ล้ไมโต=ะ ถ้าดผ่ล้

ไมSquare Square Square

Square Square Square Square Circle Circle

พ&�น

Square

วาดเกาอ��• เราเล้&อก object space ของเกาอ��ใหม!มล้(างซาย

ของม�นอย$(ทำ��จ!ด (0,0)

(0,0)y=0

y=1

y=2

วาดเกาอ��• ขาหนา

– ยายจ!ดศ$นย�กล้างไปอย$(ทำ�� (0.1, 0.35)– ขยายตามแกน x = 0.1 เทำ(า ตามแกน y = 0.35 เทำ(า– วาด Square

• พ&�น– ยายจ!ดศ$นย�กล้างไปอย$(ทำ�� (0.3, 0.8)– ขยายตามแกน x = 0.3 เทำ(า ตามแกน y = 0.1 เทำ(า– วาด Square

• ขาหล้�งแล้ะพน�ก– ยายจ!ดศ$นย�กล้างไปอย$(ทำ�� (0.7, 1.1)– ขยายตามแกน x = 0.1 เทำ(า ตามแกน y = 1.1 เทำ(า– วาด Square

Scene Graph

• เราสามารถ้แทำนการแปล้งแล้ะการวาดภาพใน สไล้ด�ทำ��แล้วไดดวยแผ่นภาพทำ��เร�ยกว(า scene

graphเกาอ��

Square

T0:3;0:8;0:0

S0:3;0:1;1:0

Square

T0:1;0:35;0:0

S0:1;0:35;1:0

Square

T0:7;1:1;0:0

S0:1;1:1;1:0

โคด• เราสามารถ้เปล้��ยน scene graph เป0นโคดไดอย(างง(ายดายvoid draw_chair(){

glPushMatrix();glTranslated(0.1, 0.35, 0.0);glScaled(0.1, 0.35, 1.0);draw_square(...);glPopMatrix();

glPushMatrix();glTranslated(0.3, 0.8, 0.0);glScaled(0.3, 0.1, 1.0);draw_square(...);glPopMatrix();

glPushMatrix();glTranslated(0.7, 1.1, 0.0);glScaled(0.1, 1.1, 1.0);draw_square(...);glPopMatrix();

}

วาดส(วนประกอบอ&�นๆ ของฉาก• สมมต�ว(าเราสรางฟิ9งก�ช�น– draw_table() เพ&�อวาดโต=ะ โดยทำ��ม!มล้(างซายของม�นอย$(

ทำ��จ!ด (0,0)– draw_tray() เพ&�อวาดถ้าดผ่ล้ไม โดยทำ��ม!มล้(างซายของ

ม�นอย$(จ!ด (0,0)– draw_floor() เพ&�อวาดพ&�น

• ฟิ9งก�ช�นพวกน��สามารถ้สรางไดเหม&อนdraw_chair()

• โคดจร�งๆ ไปด$ไดในโคดต�วอย(าง

วาดส(วนประกอบอ&�นๆ ของฉาก• เราสามารถ้วาดโต=ะแล้ะถ้าดผ่ล้ไมไดด�งต(อไปน��– วาดโต=ะโดยการเร�ยก draw_table()– วาดถ้าดผ่ล้ไม• ยายจ!ดม!มซายไปอย$(ทำ��จ!ด (0.8, 1.3)• แล้วเร�ยก draw_tray()

Scene Graph ของโต=ะแล้ะถ้าด

โต=ะแล้ะถ้าด

ถ้าด

T0:8;1:3;0:0โต=ะ

โคดvoid draw_table_and_tray(){draw_table();

glPushMatrix();glTranslated(0.8, 1.3, 0.0);draw_tray();glPopMatrix();

}

Scene Graph ของฉากฉาก

โต=ะแล้ะถ้าด

ถ้าด

T0:8;1:3;0:0โต=ะ

T¡ 1:7;¡ 1:0;0:0 พ&�น

เกาอ��

Square

T0:3;0:8;0:0

S0:3;0:1;1:0

Square

T0:1;0:35;0:0

S0:1;0:35;1:0

Square

T0:7;1:1;0:0

S0:1;1:1;1:0

T0:9;¡ 1:0;0:0

โคดvoid draw_scene(){

glPushMatrix();glTranslated(-1.7, -1.0, 0.0);draw_table_and_tray();glPopMatrix();

draw_floor();

glPushMatrix();glTranslated(0.9, -1.0, 0.0);draw_chair();glPopMatrix();

}

ผ่ล้ล้�พธ์�

บทำเร�ยน• เราสามารถ้สรางฉากทำ��ม�ความซ�บซอนไดจาก– ว�ตถ้!ง(ายๆ– การแปล้ง

• เพ&�อความสะดวกแล้ะความเขาใจง(าย เราสามารถ้จ�บกล้!(ม ว�ตถ้!เป0นกล้!(มๆ แล้วสรางฉากจากกล้!(มของว�ตถ้!ได

• เราสามารถ้แทำนการจ�ดฉากไดดวยแผ่นภาพทำ��เร�ยกว(าscene graph ซ)�งประกอบดวย– กล้(องส�าหร�บแทำนว�ตถ้!– กล้(องส�าหร�บแทำนกล้!(มของว�ตถ้!– กล้(องส�าหร�บแทำนการแปล้ง

บทำเร�ยน• เม&�อเข�ยน scene graph แล้วเราสามารถ้เข�ยนโคด

เพ&�อวาดฉากทำ�� scene graph บรรยายไดอย(างง(ายดาย– กล้(องว�ตถ้!หร&อกล้!(มของว�ตถ้! -> ฟิ9งก�ช�น– กล้(องการแปล้ง -> การเร�ยกฟิ9งก�ช�นทำ�าการแปล้ง เช(น

glTranslate, glScale หร&อ glRotate– แขนงของกล้(อง -> การเร�ยก glPushMatrix() แล้วล้ง

ไปจ�ดการแขนงน��น แล้วจ)งเร�ยก glPopMatrix()