基于HTML5和增強(qiáng)現(xiàn)實(shí)的三維思維導(dǎo)圖研究

汪升華

（瓊臺(tái)師范學(xué)院 信息技術(shù)系，海南 海口 571127）

現(xiàn)如今智能手機(jī)和平板電腦已經(jīng)層出不窮，移動(dòng)應(yīng)用逐漸呈上升趨勢(shì)，任何一項(xiàng)技術(shù)的開發(fā)都離不開移動(dòng)端。移動(dòng)端的發(fā)展形式早已不僅限于屏幕上，谷歌公司為了打破蘋果公司在移動(dòng)市場(chǎng)上的領(lǐng)先地位，大規(guī)模的谷歌眼鏡正在開發(fā)，將虛擬的世界與現(xiàn)實(shí)世界相融合，讓人們從虛擬世界中逃離。HTML5技術(shù)從根本上改變了開發(fā)應(yīng)用方式，將僅僅用手才能感受到的需求轉(zhuǎn)變成模擬真實(shí)情景的方式，與現(xiàn)實(shí)世界產(chǎn)生共鳴[1]。移動(dòng)端、輕量級(jí)、增強(qiáng)現(xiàn)實(shí)，這些特征的結(jié)合，未來的發(fā)展不可估量。基于HTML5和增強(qiáng)現(xiàn)實(shí)的三維思維導(dǎo)圖研究，希望能實(shí)現(xiàn)跨平臺(tái)、多終端的互聯(lián)網(wǎng)模式。

增強(qiáng)現(xiàn)實(shí)（Augmented Reality，AR）技術(shù)在1990年被提出，也被叫作混合現(xiàn)實(shí)。其通過一些電腦處理技術(shù)，將虛擬的部分信息結(jié)合到真實(shí)的世界，虛擬物體和真實(shí)環(huán)境實(shí)時(shí)地完美疊加到同一個(gè)空間或畫面，可以一同存在。增強(qiáng)現(xiàn)實(shí)的一般情況下提供了不同于人類能夠感知的信息，它不僅僅展現(xiàn)出了真實(shí)世界的全部信息，并且將虛擬的信息一起顯示出來了，兩種信息彼此疊加、補(bǔ)充。在視覺化現(xiàn)實(shí)增強(qiáng)中，用戶可以利用頭盔顯示器，使真實(shí)世界與電腦圖形多重合成在一起，便可以看到真實(shí)的世界。HTML5的設(shè)計(jì)目的是為了在移動(dòng)設(shè)備上支持多媒體。一個(gè)HTML5文檔到另一個(gè)文檔間的拖放功能、離線編輯、信息傳遞的增強(qiáng)、詳細(xì)的解析規(guī)則、多用途互聯(lián)網(wǎng)郵件擴(kuò)展（Multipurpose Internet Mail Extensions，MIME）和協(xié)議處理程序注冊(cè)，是SQL數(shù)據(jù)庫中存儲(chǔ)數(shù)據(jù)的通用標(biāo)準(zhǔn)（Web SQL）[2]。AR技術(shù)不止有與VR技術(shù)類似的試用領(lǐng)域，例如先進(jìn)武器、飛行器的開發(fā)與研制、數(shù)據(jù)模型的虛擬訓(xùn)練、娛樂與藝術(shù)、可視化等方面具有廣泛的實(shí)際應(yīng)用，其具有對(duì)真實(shí)環(huán)境進(jìn)行增強(qiáng)輸出顯示的特性，并且在解剖訓(xùn)練、醫(yī)療研究、軍用飛機(jī)導(dǎo)航、工程設(shè)計(jì)、精密儀器制造和維修和遠(yuǎn)程機(jī)器人操控等領(lǐng)域上，它具有比VR技術(shù)明顯的優(yōu)勢(shì)。

1 基于HTML5和增強(qiáng)現(xiàn)實(shí)的三維思維導(dǎo)圖方法設(shè)計(jì)

HTML5目的是將互聯(lián)網(wǎng)語義化，從而更好地被人類和機(jī)器閱讀，同時(shí)更好地支持各種媒體的嵌入。AR是一種實(shí)時(shí)地計(jì)算出攝影機(jī)影像的位置及角度并加上相應(yīng)圖像的技術(shù)，這種技術(shù)的目標(biāo)是在屏幕上把虛擬世界套在現(xiàn)實(shí)世界并進(jìn)行互動(dòng)[3]。通過運(yùn)用HTML5和增強(qiáng)現(xiàn)實(shí)的三維思維導(dǎo)圖效果，可以給人更加直觀的體驗(yàn)。AR是虛擬與現(xiàn)實(shí)的連接入口，與oculus等設(shè)備主張的虛擬世界沉浸不同，AR注重虛擬與現(xiàn)實(shí)的連接，是為了達(dá)到更震撼的現(xiàn)實(shí)增強(qiáng)體驗(yàn)。

手勢(shì)識(shí)別方法是在技術(shù)上借助HTML5去實(shí)現(xiàn)核心功能，在算法上涉及增強(qiáng)現(xiàn)實(shí)領(lǐng)域里的手勢(shì)識(shí)別來完成。就是對(duì)空間點(diǎn)進(jìn)行歸類，再將該類與其他類區(qū)別開成為特定子集的過程。通常業(yè)界將其分為靜態(tài)手勢(shì)識(shí)別和動(dòng)態(tài)手勢(shì)識(shí)別。靜態(tài)手勢(shì)識(shí)別就是將手形識(shí)別出來，動(dòng)態(tài)手勢(shì)識(shí)別側(cè)重于對(duì)時(shí)間或者空間中的手勢(shì)所表達(dá)的意思進(jìn)行推測(cè)和判斷。業(yè)界對(duì)靜態(tài)手勢(shì)識(shí)別都是采取聚類技術(shù)，通過聚類將手勢(shì)圖像特征提取出來與已有手勢(shì)數(shù)據(jù)訓(xùn)練庫進(jìn)行對(duì)比和歸類。如弗里曼通過設(shè)計(jì)一種可操控的濾波器求像素點(diǎn)的移動(dòng)方向，諾德教授通過Boosting算法進(jìn)行手勢(shì)分類，通過LDA和PCA方法進(jìn)行手勢(shì)識(shí)別，還有一些專家嘗試過橢圓擬合來和手勢(shì)進(jìn)行對(duì)比，這些方法都各有利弊，需要酌情選擇。

增強(qiáng)現(xiàn)實(shí)需要借助可視化技術(shù)和計(jì)算機(jī)圖形技術(shù)出現(xiàn)現(xiàn)實(shí)環(huán)境中并不存在的虛擬對(duì)象，通過傳感技術(shù)準(zhǔn)確地將虛擬對(duì)象“放置”在真實(shí)的環(huán)境中，其通過顯示設(shè)備將虛擬的對(duì)象與真實(shí)的環(huán)境融為一體，給使用者呈現(xiàn)出一個(gè)感官效果真實(shí)的新環(huán)境效果。所以增強(qiáng)現(xiàn)實(shí)系統(tǒng)擁有虛實(shí)結(jié)合、實(shí)時(shí)交互、三維注冊(cè)的新特點(diǎn)。AR的定義很廣泛，技術(shù)種類眾多，目前主流的AR是指通過設(shè)備識(shí)別判斷（二維、三維、GPS、體感、面部等識(shí)別物）將虛擬信息疊加在以識(shí)別物為基準(zhǔn)的某個(gè)位置，并顯示在設(shè)備屏幕上，可實(shí)時(shí)交互虛擬信息。總結(jié)起來即識(shí)別、虛實(shí)結(jié)合、實(shí)時(shí)交互。與三維思維導(dǎo)圖能夠有效地完成相關(guān)工作。

2 試驗(yàn)

基于HTML5和增強(qiáng)現(xiàn)實(shí)技術(shù)的三維四維導(dǎo)圖建立過程為：首先可以對(duì)目標(biāo)進(jìn)行跟蹤定位，能夠制作立體圖形并且識(shí)別圖形，通過HTML5可將圖形轉(zhuǎn)化為標(biāo)識(shí)，此外增強(qiáng)現(xiàn)實(shí)技術(shù)能夠?qū)⒁曨l和音頻資源進(jìn)行整合，設(shè)置交互，實(shí)現(xiàn)虛擬信息與真實(shí)景象的匹配與結(jié)合，完成三維思維導(dǎo)圖的構(gòu)建，并在Android移動(dòng)平臺(tái)上發(fā)布。

Web GL（Web Graphics Library）是于2011年2月發(fā)布的一種新的Web三維思維導(dǎo)圖標(biāo)準(zhǔn)，屬于HTML5標(biāo)準(zhǔn)的一項(xiàng)，可以為HTML5和增強(qiáng)現(xiàn)實(shí)的思維導(dǎo)圖提供硬件3D加速渲染效果。不同模型大小的載入響應(yīng)時(shí)間如表1所示。

表1 不同模型大小的載入響應(yīng)時(shí)間（ms）

試驗(yàn)方法如下：

（1）初始化Web三維思維導(dǎo)圖使用的環(huán)境。

試驗(yàn)結(jié)果得出，利用該方法可以將HTML5和增強(qiáng)現(xiàn)實(shí)技術(shù)完美結(jié)合，達(dá)到更好的視覺效果，為客戶帶來更好的視覺體驗(yàn)。

3 結(jié)語

本文對(duì)基于HTML5和增強(qiáng)現(xiàn)實(shí)的三維思維導(dǎo)圖方法設(shè)計(jì)及試驗(yàn)進(jìn)行分析，依托HTML5與增強(qiáng)現(xiàn)實(shí)結(jié)合機(jī)制，根據(jù)三維思維導(dǎo)圖分析數(shù)據(jù)，實(shí)現(xiàn)本文設(shè)計(jì)。試驗(yàn)結(jié)果表明，本文設(shè)計(jì)的方法具備極高的有效性。希望本文的研究能夠?yàn)镠TML5和增強(qiáng)現(xiàn)實(shí)的三維思維導(dǎo)圖的方法提供理論依據(jù)。

[1]劉華星，楊庚.HTML5的開發(fā)標(biāo)準(zhǔn)研究.計(jì)算機(jī)技術(shù)與發(fā)展[J].2017（9）：25-26.

[2]李燁民.基于HTML5的前端本地化存儲(chǔ)技術(shù)[J].成都大學(xué)學(xué)報(bào)，2017（7）：15-16.

[3]孔祥.基于移動(dòng)平臺(tái)增強(qiáng)現(xiàn)實(shí)系統(tǒng)的研究[J].2017（11）：35.