基于VRML和JavaScript的數碼攝影虛擬實(shí)驗系統的設計與實(shí)現

1 研究思路與開(kāi)發(fā)平臺的選擇

目前，基于網(wǎng)絡(luò )對實(shí)驗對象進(jìn)行三維交互展示的有效處理方法是使用專(zhuān)業(yè)的設計軟件，如采用AUTOCAD、3DS MAX等將實(shí)驗對象的三維模型設計出來(lái)。這種方法建模過(guò)程直觀(guān)形象，但生成的模型和動(dòng)畫(huà)不能與用戶(hù)進(jìn)行交互，需要將三維模型導出為相關(guān)虛擬現實(shí)設計軟件所需要的格式文件，用虛擬現實(shí)設計軟件進(jìn)行三維展示的交互設計，最后將它發(fā)布到網(wǎng)站上[1]。

經(jīng)過(guò)多年的發(fā)展，虛擬現實(shí)技術(shù)的實(shí)現也派生出多種不同的方法，現在較為流行的有VRML、Java 3D、CULT3D、X3D等多種實(shí)現方法。它們各自有不同的優(yōu)缺點(diǎn)。其中，虛擬現實(shí)建模語(yǔ)言VRML(Virtual Reality Modeling Language)是一種描述大量對象的屬性及相互關(guān)系的語(yǔ)言，具有平臺無(wú)關(guān)性、三維交互性、多媒體集成、境界逼真等眾多優(yōu)越的特征，所以選擇該軟件作為開(kāi)發(fā)平臺。雖然VRML可以通過(guò)直接編程進(jìn)行語(yǔ)義描述，建立實(shí)驗對象的三維模型，但這種方法適合建立簡(jiǎn)單規則的模型。數碼單反相機主要由機身和鏡頭兩部分組成。機身上又包括取景窗口、液晶顯示屏、曝光模式選擇盤(pán)、控制撥輪以及各個(gè)操作按鈕等，結構比較復雜，不宜直接用VRML語(yǔ)言進(jìn)行語(yǔ)義描述。而是利用3DS MAX建立整個(gè)模型，并賦予材質(zhì)、色彩、光照，導出VRML的格式文件(.*wrl文件)。因此，選擇3DS MAX進(jìn)行建模，再使用VRML軟件進(jìn)行交互設計并實(shí)現網(wǎng)上發(fā)布，建立逼真的交互式三維虛擬實(shí)驗環(huán)境，可以讓學(xué)生隨時(shí)通過(guò)網(wǎng)絡(luò )瀏覽三維場(chǎng)景，并通過(guò)人機交互進(jìn)行仿真實(shí)驗。

2 三維虛擬數碼單反相機的設計與實(shí)現

實(shí)驗對象的建模是虛擬實(shí)驗開(kāi)發(fā)過(guò)程中最重要的一步，模型的好壞直接影響運行的效果和場(chǎng)景的沉浸度。為了便于在VRML瀏覽器中設計三維數碼單反相機的交互，可以真實(shí)地模擬實(shí)際操作進(jìn)行鏡頭的旋轉、曝光模式選擇盤(pán)的轉動(dòng)、控制撥輪和按鈕的操作等，在對數碼相機進(jìn)行建模時(shí)，將其各部分分別建模，后期組裝。將數碼單反相機的三維模型建好后，在3DS MAX中應用輸出插件導出*wrl格式的文件。在運用3DS MAX模型導出VRML文件后要充分注意優(yōu)化VRML程序。優(yōu)化技術(shù)是三維虛擬建模過(guò)程中至關(guān)重要的一個(gè)環(huán)節，優(yōu)化結果的好壞將直接影響三維數碼相機的顯示速度和交互效果[2]。

3 使用VRML語(yǔ)言結合JavaScript實(shí)現數碼單反相機的虛擬實(shí)驗

數碼單反相機虛擬實(shí)驗系統共包括四個(gè)實(shí)驗，分別是：認識數碼相機、數碼相機的調節模式、數碼相機的光圈調節、數碼相機快門(mén)調節。

3.1 認識數碼單反相機模塊的設計與實(shí)現[3]

實(shí)驗1是對數碼單反相機的三維展示，主要分為：(1)自由旋轉展示。在這種方式下，相機自動(dòng)在瀏覽器中旋轉，讓學(xué)習者從不同的角度上觀(guān)察相機的結構。(2)手動(dòng)控制展示。在這種方式下，學(xué)習者可以自主轉動(dòng)相機，從不同角度細致地觀(guān)察相機。

為了實(shí)現相機的自由旋轉展示，可以運用時(shí)間傳感器節點(diǎn)(TimeSensor)和方向插補器節點(diǎn)(OrientationInterpolator)。TimeSensor節點(diǎn)的作用是創(chuàng )建一個(gè)虛擬時(shí)鐘，可以像時(shí)鐘一樣標記時(shí)間的流逝，設置開(kāi)始動(dòng)畫(huà)、結束動(dòng)畫(huà)和控制動(dòng)畫(huà)的播放速度等屬性，并向插補器節點(diǎn)輸出時(shí)間事件，產(chǎn)生相應的動(dòng)畫(huà)效果。OrientationInterpolator可改變觀(guān)察方向或者改變形狀體的方向。插補器節點(diǎn)使用一組關(guān)鍵時(shí)刻和關(guān)鍵值來(lái)描述一個(gè)動(dòng)畫(huà)。關(guān)鍵時(shí)刻列表在插補器節點(diǎn)的key域中指定，關(guān)鍵值列表在插補器節點(diǎn)的keyvalue域中指定。瀏覽器在渲染時(shí)將根據這些關(guān)鍵時(shí)刻所對應的關(guān)鍵狀態(tài)在場(chǎng)景中通過(guò)線(xiàn)性插值計算技術(shù)自動(dòng)生成連續動(dòng)畫(huà)。實(shí)現自由旋轉展示部分相應代碼如下：

OrientationInterpolator{ //創(chuàng )建控制動(dòng)畫(huà)的插補器
key [0 0.5 1]//指定關(guān)鍵時(shí)刻列表
keyValue [//指定對應的旋轉關(guān)鍵值列表
0 1 0 0，
0 1 0 3.14，
0 1 0 6.28
]
}
TimeSensor {//創(chuàng )建控制動(dòng)畫(huà)的時(shí)間感應器
enabled TRUE
cycleInterval 30//指定每個(gè)變化周期的時(shí)間長(cháng)短
}
ROUTE clock_camera.fraction_changed TO camera_auto_rotation.set_fraction
ROUTE camera_auto_rotation.value_changed TO
camera_all.rotation

在ROUTE中，將TimeSensor的fraction_changed出事件路由到插補器的set_fraction入事件，每次時(shí)間傳感器輸出一個(gè)新的時(shí)刻，插補器就會(huì )利用輸入的時(shí)間計算出一個(gè)新的旋轉值，然后通過(guò)其value_changed出事件路由到方向插補器節點(diǎn)。

為了能從各種角度來(lái)展示相機，運用SphereSensor傳感器節點(diǎn)，對相機進(jìn)行了手動(dòng)的三維展示。 SphereSensor節點(diǎn)用于感知觀(guān)察者的拖動(dòng)動(dòng)作，并且計算旋轉角和角度。通過(guò)使用它的rotation_changed域輸出變化的參數，對相機整體進(jìn)行360°上下左右的旋轉完成相機的手動(dòng)展示。代碼如下：
SphereSensor{
enabled TRUE
}

ROUTE camera_sd.rotation_changed TO camera_all.rotation
對于VRML窗口與網(wǎng)頁(yè)之間的交互主要是通過(guò)JavaScript和VRML中的TouchSensor節點(diǎn)完成。由于TouchSensor節點(diǎn)能感知用戶(hù)的鼠標事件，一般的鼠標操作通常有3種：移動(dòng)、點(diǎn)擊、拖動(dòng)。本設計主要使用了移動(dòng)操作，當用戶(hù)進(jìn)行移動(dòng)操作的時(shí)候會(huì )使TouchSensor中的isOver公共域變?yōu)門(mén)RUE，傳遞出去一個(gè)真事件。在網(wǎng)頁(yè)中用JavaScript接收到該事件再運用相應的程序完成相應的操作，然后在VRML場(chǎng)景中運用Onmousemove感知鼠標的移動(dòng)事件。VRML場(chǎng)景中主要代碼：
Touchsensor {
Enabled TRUE
}

在網(wǎng)頁(yè)中對VRML場(chǎng)景運用了Onmousemove感知鼠標的移動(dòng)事件，當鼠標作用于VRML場(chǎng)景時(shí)會(huì )觸發(fā)相應的處理事件javascript代碼，例如當鼠標移動(dòng)到LCD顯示屏時(shí)，用到了條件判斷語(yǔ)句對其進(jìn)行判斷：
if(M_e.Nodes(Viewfinder_button).Fields(isOver)==-1){
display_div(2，12)；
}

然后進(jìn)行相應的處理操作。其中Viewfinder_button是取景器的觸發(fā)傳感器TouchSensor的名稱(chēng)。

3.2 數碼相機曝光模式的選擇模塊的設計與實(shí)現

　在實(shí)驗2中，要求能模擬真實(shí)的數碼相機的操作，允許學(xué)習者通過(guò)轉動(dòng)曝光模式調節環(huán)，選擇不同的曝光模式。每一種曝光模式都有各自的特點(diǎn)以及適用的場(chǎng)合。實(shí)現這一效果，是在VRML中使用CylinderSensor(圓柱傳感器)與Script節點(diǎn)的結合實(shí)現了用戶(hù)與曝光模式選擇盤(pán)的交互。CylinderSensor節點(diǎn)也可以感知一個(gè)觀(guān)察者的拖動(dòng)動(dòng)作，并且計算轉軸和角度，通過(guò)它的rotation_changed域(eventOut出事件)輸出。其代碼如下：
CylinderSensor{
exposedField SFFloat minAngle 0
exposedField SFFloat maxAngle -1
exposedField SFBool enabled TRUE
exposedField SFFloat diskAngle 0.262
exposedField SFFloat offset 0
exposedField SFFloat autooffset TRUE
eventOut SFBool isActive
eventOut SFVce3f trackPoint_changed
eventOut SFRotation rotation_changed
}

觀(guān)察者每次改變軌跡點(diǎn)時(shí)，autoOffset、offset、maxAngle和minAngle域值在一起作用把軌跡點(diǎn)轉化成為旋轉值，并通過(guò)rotation_changed域(eventOut出事件)輸出。然后通過(guò)旋轉角度的不同改變LCD顯示屏上不同的曝光模式畫(huà)面。同時(shí)也向瀏覽器環(huán)境傳遞不同的旋轉角度，瀏覽器根據不同的旋轉角度來(lái)顯示不同的模式說(shuō)明。

3.3 光圈與快門(mén)的調節模塊的設計與實(shí)現

實(shí)驗3和實(shí)驗4分別是針對光圈大小和快門(mén)大小進(jìn)行調節，然后在模擬的場(chǎng)景中進(jìn)行拍攝，比較不同的光圈值和快門(mén)速度對畫(huà)面成像效果的影響。這樣，既讓學(xué)生掌握了光圈和快門(mén)值的調整方法，又讓他們理解了光圈值和快門(mén)速度與畫(huà)面成像效果的關(guān)系。這兩部分實(shí)現的方法相似，所以在此一并說(shuō)明。

以快門(mén)速度的調整為例，通過(guò)設置不同的快門(mén)速度，模擬了不同的成像效果。首先通過(guò)機身上的調節按鈕設置快門(mén)速度，如圖1所示，分別設置快門(mén)速度為1/200 s與1/1 000 s。

然后到模擬的三維場(chǎng)景中進(jìn)行取景操作。由于不同的快門(mén)速度對成像效果的影響主要是體現在動(dòng)態(tài)被攝對象上，所以，在場(chǎng)景中模擬了一輛奔跑的汽車(chē)，按下拍攝，即可得到模擬的成像效果，如圖2所示。

具體實(shí)現方法如下：
if(a==4){
M_e.Nodes(tv_sensor).Fields(offset)=-4.125；
M_e.Nodes(tv_sensor).Fields(enabled)=-1；
M_e.Nodes(start_t4_script).Fields(show)=-1；
}
else{
M_e.Nodes(tv_sensor).Fields(enabled)=0；
if(a==1||a==2){
M_e.Nodes(start_t4_script).Fields(show)=0；
}else{
M_e.Nodes(start_t5_script).Fields(show)=0；
}
document.getElementById(left_content).style.display=none
也就是用JavaScript啟動(dòng)了VRML中快門(mén)傳感器和控制放在VRML中快門(mén)傳感器的動(dòng)作。
4 網(wǎng)絡(luò )發(fā)布與插件的自動(dòng)安裝
VRML 文件可以采用超級鏈接的方式把HTML文件和VRML 文件鏈接到一起，這對于三維模型的虛擬展示具有十分重要意義。HTML文件格式的標準并不支持對VRML文檔的嵌入，但非標準HTML提供＜EMBED＞標記可實(shí)現VRML文檔的嵌入。例如下面的語(yǔ)句實(shí)現了VRML文檔camera.wrl在HTML文件中的嵌入，其中SRC域指定關(guān)聯(lián)的URL，“camera.wrl”是一個(gè)VRML文件。
OBJECT CLASSID=CLSID：4B6E3013-6E45-11D0-9309-0020AFE05CC8 WIDTH=600px HEIGHT=400px； >
PARAM NAME=SRC VALUE=vrml/camera.wrl>
EMBED name=camera id=camera src=vrml/camera.wrl TYPE=application/x-cc3d onmousemove=test1_contactVW()；/>
/OBJECT>
在網(wǎng)頁(yè)中要進(jìn)行對VRML的操作只進(jìn)行上述嵌入是遠遠不夠的，還要通過(guò)javaScript中的M_e=camera.Engine，獲取對相機VRML場(chǎng)景的句柄并賦給M_e。這樣，就可以對VRML場(chǎng)景中的每一個(gè)節點(diǎn)中的每一個(gè)域和事件的值進(jìn)行獲取了。

為了保證用戶(hù)機器上能正常播放，需要在用戶(hù)機器上安裝VRML瀏覽器?？赏ㄟ^(guò)以下代碼實(shí)現自動(dòng)安裝：
OBJECT CLASSID=CLSID：4B6E3013-6E45-11D0-9309-0020AFE05CC8 WIDTH=600px HEIGHT=400px；
codebase=source/cortvrml.exe>
PARAM NAME=SRC VALUE=vrml/camera.wrl>
EMBED name=camera id=camera src=vrml/camera.wrl pluginspage=source/cortvrml.exe type=application/x-shockwave-flash TYPE=application/x-cc3d onmousemove=test1_contactVW()；/>
/OBJECT>

虛擬實(shí)驗是開(kāi)展網(wǎng)絡(luò )教學(xué)的一個(gè)瓶頸，而其中最關(guān)鍵的是沒(méi)能較好地解決交互性的問(wèn)題。利用VRML技術(shù)，結合支持VRML的開(kāi)發(fā)工具構建一個(gè)虛擬實(shí)驗環(huán)境，并利用Java提供的支持VRML的開(kāi)發(fā)包，實(shí)現了用戶(hù)與虛擬環(huán)境之間的交互，可以滿(mǎn)足數碼攝影虛擬實(shí)驗教學(xué)的需要。實(shí)驗常常是一種協(xié)作性的活動(dòng)，合作是實(shí)驗過(guò)程中一個(gè)至關(guān)重要的環(huán)節，因此，要充分利用現代網(wǎng)絡(luò )技術(shù)，增強對虛擬實(shí)驗的協(xié)同操作，進(jìn)一步體現網(wǎng)上實(shí)驗的優(yōu)勢[4]。