1
1
TH3813 Realiti MayaAnimasi, pengesan dangeometri
2
Pengenalankepada Animasi
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 3
LatarbelakangNod seperti Billboard dan Anchor mempunyaifungsi tersendiriBoleh bina fungsi khusus untuk bolehkan bentukbergerak, berputar, dll.Perlu kepada “trigger”, masa dan tindakbalasterhadap siri peristiwa untuk hasilkan interaksipengguna/persekitaran yang lebih baik
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 4
Membina litar animasiHampir kesemua nod boleh menjadi komponendalam litar animasi
nod bertindak sepert bahagian elektronik mayanod boleh terima dan hantar peristiwa (events)laluan hubungkan bersama nod-nod
Peristiwa (event) ialah mesej yang dihantar antaranod
nilai data (seperti translasi)time stamp (bila peristiwa dihantar)
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 5
ContohUntuk pusingkan bentuk
hubungkan nod yang menghantar peristiwaputaran kepada medan rotation dalam nod Transform
Untuk blinkkan bentukhubungkan nod yang hantar peristiwa warnakepada medan diffuseColor dalam nod Material
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 6
Melalukan peristiwaUntuk setup litar animasi, perlu kepada 3 perkara:
nod yang menghantar peristiwanod mesti dinamakan dengan DEF
nod yang menerima peristiwanod mesti dinamakan denan DEF
laluan yang hubungkan nod-nod
2
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 7
Penggunaan nod input/outputSetiap nod mempunyai medan, input dan output
medan (field): nilai yang disimpaneventIn: satu inputeventOut: satu output
exposedField ialah ringkasan bagi field, eventIndan eventOut
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 8
Contoh inputNod Transform mempunyai eventIns berikut:
set_translationset_rotationset_scale
Nod Material mempunyai eventIns berikut:set_diffuseColorset_emissiveVolorset_transparency
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 9
Contoh outputNod OrientationInterpolator mempunyai eventOut:
value_changed untuk hantar nilai putaranNod PositionInterpolator mempunyai eventOut:
value_changed untuk untuk hantar nilai kedudukan(translation)
Nod TimeSensor mempunyai eventOut:time untuk hantar nilai masa
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 10
Sintaks: ROUTEPernyataan ROUTE hubungkan bersama dua nod menggunakan:
nama nod penghantar dan nama eventOutnama nod penerima dan nama eventIn
ROUTE MySender.rotation_changedTO MyReceiver.set_rotation
ROUTE dan TO mesti berhuruf besar
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 11
Jenis data bagi peristiwaJenis data bagi peristiwa antara pengirim danpenerima mesti samaJenis data mempunyai nama dengan format piawai, seperti:
SFString, SFRotation, atau MFColorCharacter Nilai1 S: nilai tunggal
M: nilai berbilang2 Sentiasa Fselebihnya nama jenis data, spt String,
Rotation atau Color TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 12
Jenis data peristiwaJenis data Maksud
SFBool Boolean, nilai true atau false
SFColor, MFColor nilai warna RGB
SFFloat, MFFloat nilai floating point
SFImage Nilai imej
SFInt32, MFInt32 Nilai integer
SFNode, MFNode Nilai nod
3
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 13
Jenis data peristiwaJenis data Maksud
SFRotation, MFRotation Nilai putaran
SFString, MFString Nilai rentetan teks
SFTime Nilai masa
SFVec2f, MFVec3f Nilai XY floating point
SFVec3f, MFVec3f Nilai XYZ floating point
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 14
Konvensi penamaanKebanyakan nod mempunyai exposedFieldsJika nama exposedField ialah xxx, maka:
set_xxx ialah eventIn untuk setkan medanxxx_changed ialah eventOut yang dihantar apabilamedan berubahset_ dan _changed suffix adalah optional tetapidigalakkan
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 15
Konvensi penamaanNod Transform mempunyai:
medan rotationset_rotation eventInrotation_changed eventOut
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 16
Contoh animasiDEF Touch TouchSensor { }
DEF Timer1 TimeSensor { . . . }
DEF Rot1 OrientationInterpolator { . . . }
DEF Frame1 Transform {children [
Shape { . . . }]
}ROUTE Touch.touchTime TO Timer1.set_startTimeROUTE Timer1.fraction_changed TO Rot1.set_fractionROUTE Rot1.value_changed TO Frame1.set_rotation
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 17
Contoh animasi
colors.wrl
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 18
Menggunakan laluan berbilangBoleh mempunyai fan-out
Berbilang laluan daripada pengirim yang samaBoleh mempunyai fan-in
berbilang laluan kepada penerima yang sama
4
19
Penganimasiantransformasi
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 20
LatarbelakangAnimasi berubah mengikut masa
kedudukan - memandu keretaorientasi - pesawatwarna - perubahan musim
Animasi memerlukan kawalan berdasarkan masabila bermula dan tamatsepantas mana
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 21
Contoh transformasi animasi
floater.wrl
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 22
Kawalan masaNod TimeSensor sama seperti stop watch
kawal masa mula dan berhentiSensor janakan peristiwa masa semasa berjalanUntuk animasikan, lalukan peristiwa masa padanod lain
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 23
Penggunaan masa mutlakNod TimeSensor janakan masa mutlak danpecahan peristiwa masaMasa mutlak berikan masa masa jam biasa
masa mutlak diukur dalam saat mulai 1 Januari1970, 12:00amberguna untuk lakukan peristiwa pada tarikh danmasa tertentu
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 24
Penggunaan masa pecahanPeristiwa masa pecahan berikan nombor 0.0 - 1.0
bila sensor bermula, outputnya ialah 0.0di akhir kitaran, outputnya ialah 1.0bilangan saat antara 0.0 higa 1.0 di kawal olehselang kitaran (cycle interval)
Sensor boleh lakukan loop selama- lamanya, atauhanya lalui satu kitaran dan berhenti
5
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 25
Sintaks: TimeSensorNod TimeSensor janakan peristiwa berdasarkanmasa
startTime dan stopTime - bila untuk lariancycleInterval - tempoh (jangkamasa) kitaranloop - sama ada perlu untuk ulang semula kitaran
TimeSensor {cycleInterval 1.0loop FALSEstartTime 0.0stopTime 0.0
} TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 26
Sintaks: TimeSensorTimeSensor {
enabled TRUE #exposedField SFBoolstartTime 0.0 #exposedField SFTime
cycleInterval 1.0 #exposedFieldSFTime
loop FALSE #exposedField SFBoolisActive #eventOut SFBooltime #eventOut SFTimecycleTime #eventOut SFTimefraction_changed #eventOut SFFloat
}
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 27
Penggunaan timerUntuk hasilkan larian time yang berterusan:loop TRUEstopTime <= startTime
Bila stopTime <= starTime, stopTime tidakdiendahkan
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 28
Penggunaan timerUntuk larian sehingga stopTime:loop TRUEstopTime > startTime
Untuk larian satu putaran kemudian berhenti:loop FALSEstopTime <= starTime
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 29
Penggunaan timerInput peristiwa set_startTime:
tentukan bila timer perlu mulaInput peristiwa set_stopTime:
tentukan bila timer perlu berhenti
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 30
Penggunaan output timerOutput peristiwa isActive:
output TRUE pada ketika timer bermulaoutput FALSE pada ketika timer berhenti
Output peristiwa time:hasilkan masa mutlak sebagai output
Output peristiwa fraction_changed:hasilkan output 0.0 - 1.0 ketika kitaranresetkan kembali ke 0.0 pada permulaan setiapkitar
6
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 31
Contoh time sensorShape {
appearance Appearance {material DEF Monolith1Facade Material {
diffuseColor 0.2 0.2 0.2}
}geometry Box { size 2.0 4.0 0.3 }
}DEF Monolith1Timer TimeSensor {
cycleInterval 4.0loop FALSEstartTime 0.0stopTime 0.1
}
ROUTE Monolith1Touch.touchTimeTO Monolith1Timer.set_startTime
ROUTE Monolith1Timer.fraction_changedTO Monolith1Facade.set_transparency
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 32
Contoh penggunaan time sensor
monolith.wrl
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 33
Penukaran masa kepadakedudukan
Untuk animasikan kedudukan sesuatu bentuk, berikan:
senarai kedudukan utama untuk pergerakanmasa bagi setiap kedudukan berada
Nod interrpolator terjemahkan input masa kepadaoutput kedudukan
apabila masa berada antara dua kedudukanutama, interpolator kirakan kedudukan perantara
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 34
Interpolasi kedudukanSetiap kedudukan utama di sepanjang laluanmempunyai:
nilai utama (spt kedudukan)pecahan masa utama
Interpolasi isikan nilai antara nilai utama
Masa Pecahan Kedudukan0.0
0.00.0 0.0 0.00.4 0.1 0.0
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 35
Interpolasi kedudukan
Masa Pecahan Kedudukan0.0
0.00.0 0.0 0.00.4 0.1 0.0
0.2. . .
0.8 0.2 0.0. . . .
0.5. . .
4.0 1.0 0.0. . . .
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 36
Sintaks: PositionInterpolatorNod PositionInterpolator tentukan kedudukanlaluan
key - pecahan masa utamakeyValue - kedudukan utama
PositionInterpolator {key [ 0.0, . . . ]keyValue [ 0.0 0.0 0.0, . . . ] }
Lazimnya, laluan kepada input set_translationdalam nod Transform
7
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 37
Penggunaan interpolatorInput set_fraction:
setkan masa pecahan terkini di sepanjang laluanutama
Output value_changed:hasilkan kedudukan disepanjang laluan sebagioutput setiap kali pecahan disetkan
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 38
Contoh penggunaan interpolasikedudukanDEF Particle1 Transform {
children [Shape { . . . }
]}DEF Timer1 TimeSensor {
cycleInterval 12.0loop TRUEstartTime 0.0stopTime -1.0
}DEF Position1 PositionInterpolator {
key [ 0.0, . . . ]keyValue [ 0.0 0.0 0.0, . . .]
}ROUTE Timer1.fraction_changed TO Position1.set_fractionROUTE Position1.value_changed TO Particle1.set_translation
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 39
PositionInterpolator: Contohmudah
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 40
#VRML V2.0 utf8Group {
children [# Moving box
DEF Cube Transform {children Shape {
appearance Appearance {material Material { }
}geometry Box { size 1.0 1.0 1.0 }
}},
# Animation clockDEF Clock TimeSensor {
cycleInterval 4.0loop TRUE
},# Animation path
DEF CubePath PositionInterpolator {key [
0.00, 0.11, 0.17, 0.22,0.33, 0.44, 0.50, 0.55,0.66, 0.77, 0.83, 0.88,0.99
]keyValue [
0.0 0.0 0.0, 1.0 1.96 1.0,1.5 2.21 1.5, 2.0 1.96 2.0,3.0 0.0 3.0, 2.0 1.96 3.0,1.5 2.21 3.0, 1.0 1.96 3.0,0.0 0.0 3.0, 0.0 1.96 2.0,0.0 2.21 1.5, 0.0 1.96 1.0,0.0 0.0 0.0
]}
]}ROUTE Clock.fraction_changed TO CubePath.set_fractionROUTE CubePath.value_changed TO Cube.set_translation
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 41
Contoh penggunaan interpolasikedudukan
spiral.wrl
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 42
Penggunaan interpolasi lainAnimasi kedudukan PositionInterpolatorAnimasi putaran OrientationInterpolatorAnimasi skala PositionInterpolatorAnimasi warna ColorInterpolatorAnimasi tranparency ScalarInterpolator
8
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 43
Sintaks: OrientationInterpolatorNod OrientationInterpolator tentukan laluanputaran
key - nilai pecahan masakeyValue - putaran utama (paksi & sudut)
OrientationInterpolator {key [ 0.0, . . . ]keyValue [ 0.0 1.0 0.0 0.0, . . . ] }
Lazimnya laluan ke input set_rotation dalam nod Transform
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 44
Sintaks: PositionInterpolatorNod PositionInterpolator tentukan kedudukan atau laluan skala
key - nilai pecahan masakeyValue - kedudukan utama (atau skala)
PositiontionInterpolator {key [ 0.0, . . . ]keyValue [ 0.0 0.0 0.0 0.0, . . . ] }
Lazimnya laluan ke input set_scale dalam nod Transform
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 45
Sintaks: ColorInterpolatorNod ColorInterpolator tentukan laluan warna
key - nilai pecahan masakeyValue - warna utama (merah, hijau, biru)
ColorInterpolator {key [ 0.0, . . . ]keyValue [ 1.0 1.0 0.0 0.0, . . . ]
}Lazimnya laluan ke input set_diffuseColor atau set_emissiveColor dalam nod Material
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 46
Contoh mudah: ColorInterpolator
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 47
Sintaks: ScalarInterpolatorNod ScalarInterpolator tentukan kedudukan atau laluan skala
key - nilai pecahan masakeyValue - skala utama
ScalarInterpolator {key [ 0.0, . . . ]keyValue [ 4.5, . . . ] }
Lazimnya laluan ke input set_transparency dalam nod Transform
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 48
Contoh penggunaan lain-lain interpolator
squisher.wrl
9
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 49
ContohTentukan bagaimanakah menghasilkan animasimudah di bawah ?
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 50
Group {children [# Rotating cylinder
DEF Column Transform {rotation 0.0 0.0 1.0 0.0children Shape {
appearance Appearance {material Material { }
}geometry Cylinder {
height 1.0radius 0.2
}}
},
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 51
# Animation clockDEF Clock TimeSensor {
cycleInterval 4.0loop TRUE
},# Animation path
DEF ColumnPath OrientationInterpolator {key [ 0.0, 0.50, 1.0 ]keyValue [
0.0 0.0 1.0 0.0,0.0 0.0 1.0 3.14,0.0 0.0 1.0 6.28
]}
]}
TH3813 06 VRML 4 © Dr. Shahrul Azman Mohd [email protected] 52
ROUTE Clock.fraction_changed TO ColumnPath.set_fractionROUTE ColumnPath.value_changed TO Column.set_rotation
Top Related