這篇文章本應該在2個月前就出現(xiàn)了，但是一直都沒有足夠的動力去寫枫绅。直到泉孩，我最近在玩知乎，也看到了一個類似的問題并淋。加上這是一個無聊的小長假寓搬，就把這篇文章寫出來。
這篇文章分成四部分：
- 基礎知識：3D世界與四元數(shù)
- 一個Hello, World
- 應用篇——高級示例
因為我只玩過公司的Oculus DK2县耽，所以這里是以DK2為內(nèi)容而展開的句喷。
實際上，要用JavaScript來用VR程序是很簡單的一件事：
- 使用Node.js來讀取Oculus上的傳感器的數(shù)據(jù)兔毙，將這些數(shù)據(jù)用WebSocket協(xié)議來提供一個服務唾琼。
- 尋找一個3D游戲引擎，如Three.js來創(chuàng)建一個3D世界澎剥。
- 讀取傳感器的值將其表示在3D世界中锡溯。
這點也可以用在混合應用上，你只需要有一個CardBoard即可哑姚。使用Cordova讀取手機傳感器的數(shù)據(jù)祭饭，再通過這些數(shù)據(jù)來改變WebView的狀態(tài)——除了發(fā)熱會比較嚴重，應該沒有別的影響叙量。
基礎知識：3D世界與四元數(shù)
在我們所熟知的3D游戲里倡蝙，點的位置由三個坐標決定的（x，y绞佩，z）寺鸥，如下圖所示：
這三個坐標只能表示我們在這個世界的位置，而不能上下的看這個世界征炼。
Oculus DK2用的是MPU(Motion Processing Unit)芯片是MPU6500析既，是第二個整合性6軸運動處理組件（第一個是MPU6050）。它可以數(shù)字輸出6軸或9軸的旋轉(zhuǎn)矩陣谆奥、四元數(shù)(quaternion)眼坏、歐拉角格式(Euler Angle forma)的融合演算數(shù)據(jù)。
這時候酸些，我們就需要歐拉角以及四元數(shù)來表示物體在虛擬世界的狀態(tài)宰译。（PS：原諒我只能簡單地提一下）
歐拉角是一組用于描述剛體姿態(tài)的角度，歐拉提出魄懂，剛體在三維歐氏空間中的任意朝向可以由繞三個軸的轉(zhuǎn)動復合生成沿侈。通常情況下，三個軸是相互正交的市栗。
其對應的三個角度又分別成為roll（橫滾角）缀拭，pitch（俯仰角）和yaw（偏航角）咳短。
而四元數(shù)則是：
四元數(shù)可以用于表示三維空間里的旋轉(zhuǎn)。它常用的另外兩種表示方式（三維正交矩陣和歐拉角）是等價的蛛淋。人們用四元數(shù)來表示旋轉(zhuǎn)要解決兩個問題咙好，一是如何用四元數(shù)表示三維空間里的點，二是如何用四元數(shù)表示三維空間的旋轉(zhuǎn)褐荷。
之前玩過的6050出來大概就是這樣子的勾效，如果你玩四軸飛行器的話，你也應該這樣玩過：
Copy/Paste完上面的內(nèi)容后叛甫，你可能沒有啥概念层宫，還是舉個hello，world的例子其监。
例子: 一個hello,world
讓我們在回到一開始說的那三步萌腿，我們將需要做三件事：
- 尋找一個Node的Oculus拓展——不過，這件事現(xiàn)在可以交給WebVR棠赛。
- 尋找一個Web的3D庫哮奇，及其對應的Oculus展示插件。
- 讀取傳感器數(shù)據(jù)睛约，顯示到虛擬世界中。
如下圖所示:
于是找至了對應的Node庫有：Node-HMD哲身，它可以讀取傳感器的數(shù)據(jù)辩涝。
還有Three.js和 Oculus Effect插件，可以顯示出下面的視圖：
這樣勘天，我們DK2 Control讀取傳感器的數(shù)據(jù)怔揩，就可以到這個虛擬世界玩了~~。
更詳細的介紹可以見： https://github.com/phodal/oculus-nodejs-threejs-example
高級應用: 火星漫游者
上面的應用示例還是太簡單了脯丝，讓我們來看一個高級應用——這是我們在兩個月前做的另外一個Hackday Idea商膊，這是另外一個“火星漫游者”：
想象一下你想去看看火星，但是你又沒有錢去宠进。而你可以租用這樣的一個機器人晕拆，然后你就可以在火星漫游了。
因此材蹬，首先我們需要一個實時視頻通訊实幕，這里我們就用到了WebRTC:
通過WebRTC我們就可以在計算機瀏覽器上實現(xiàn)實時通訊，再通過Three.js就可以將這個視頻轉(zhuǎn)為一個近似3D的視角堤器。而捕獲這個視頻即可以通過手機上的瀏覽器昆庇，也可以在手機上編寫相應的Web應用。
這里有一個在線的Demo：http://laht.info/WebGL/DK2Demo.html
架構(gòu)大致如下圖所示：
這樣我們就解決了實時視頻這個問題闸溃，然后我們還需要去控制硬件：
- 用WebSocket協(xié)議來提供Oculus的上整吆、下拱撵、左、右運動的數(shù)據(jù)
- 在手機上讀取這個傳感器數(shù)據(jù)表蝙，并將這個數(shù)據(jù)通過BLE傳送到小車上裕膀。
- 小車以通過指令來做相應的運動。
關(guān)于這部分內(nèi)容的可以看我之前的那篇文章《我是如何Hack一個機器人的勇哗？》
總結(jié): All in JavaScript
與C坑坑（C++）相比昼扛，JavaScript更適合搭建原型——快速、直接欲诺、有效抄谐，畢竟C++編譯需要時間的。運行起來的效果也如預期的一樣扰法，電腦風扇各種轉(zhuǎn)蛹含，不知道是不是Mac專有的。不過塞颁，我想這個性能問題是一直都有的浦箱。
