因?yàn)槲抑煌孢^(guò)公司的 Oculus DK2，所以這里是以 DK2 為內(nèi)容而展開(kāi)的。

    實(shí)際上，要用 javascript 來(lái)用 VR 程序是很簡(jiǎn)單的一件事：

    使用 Node.js 來(lái)讀取 Oculus 上的傳感器的數(shù)據(jù)，將這些數(shù)據(jù)用 WebSocket 協(xié)議來(lái)提供一個(gè)服務(wù)。

    尋找一個(gè) 3D 游戲引擎，如 Three.js 來(lái)創(chuàng)建一個(gè) 3D 世界。

    讀取傳感器的值將其表示在 3D 世界中。

    這點(diǎn)也可以用在混合應(yīng)用上，你只需要有一個(gè) CardBoard 即可。使用 Cordova 讀取手機(jī)傳感器的數(shù)據(jù)，再通過(guò)這些數(shù)據(jù)來(lái)改變 WebView 的狀態(tài)——除了發(fā)熱會(huì)比較嚴(yán)重，應(yīng)該沒(méi)有別的影響。

    基礎(chǔ)知識(shí)：3D 世界與四元數(shù)

    在我們所熟知的 3D 游戲里，點(diǎn)的位置由三個(gè)坐標(biāo)決定的（x，y，z），如下圖所示：

    這三個(gè)坐標(biāo)只能表示我們?cè)谶@個(gè)世界的位置，而不能上下的看這個(gè)世界。

    Oculus DK2 用的是 MPU (Motion Processing Unit)芯片是 MPU6500，是第二個(gè)整合性 6 軸運(yùn)動(dòng)處理組件（第一個(gè)是 MPU6050）。它可以數(shù)字輸出 6 軸或 9 軸的旋轉(zhuǎn)矩陣、四元數(shù)(quaternion)、歐拉角格式(Euler Angle forma)的融合演算數(shù)據(jù)。

    這時(shí)候，我們就需要?dú)W拉角以及四元數(shù)來(lái)表示物體在虛擬世界的狀態(tài)。（PS：原諒我只能簡(jiǎn)單地提一下）

    歐拉角是一組用于描述剛體姿態(tài)的角度，歐拉提出，剛體在三維歐氏空間中的任意朝向可以由繞三個(gè)軸的轉(zhuǎn)動(dòng)復(fù)合生成。通常情況下，三個(gè)軸是相互正交的。

    其對(duì)應(yīng)的三個(gè)角度又分別成為 roll（橫滾角），pitch（俯仰角）和 yaw（偏航角）。

    而四元數(shù)則是：

    四元數(shù)可以用于表示三維空間里的旋轉(zhuǎn)。它常用的另外兩種表示方式（三維正交矩陣和歐拉角）是等價(jià)的。人們用四元數(shù)來(lái)表示旋轉(zhuǎn)要解決兩個(gè)問(wèn)題，一是如何用四元數(shù)表示三維空間里的點(diǎn)，二是如何用四元數(shù)表示三維空間的旋轉(zhuǎn)。

    之前玩過(guò)的 6050 出來(lái)大概就是這樣子的，如果你玩四軸飛行器的話，你也應(yīng)該這樣玩過(guò)：

    Copy/Paste 完上面的內(nèi)容后，你可能沒(méi)有啥概念，還是舉個(gè) hello，world 的例子。

    例子: 一個(gè) hello,world

    讓我們?cè)诨氐揭婚_(kāi)始說(shuō)的那三步，我們將需要做三件事：

    尋找一個(gè) Node 的 Oculus 拓展——不過(guò)，這件事現(xiàn)在可以交給 WebVR。

    尋找一個(gè) Web 的 3D 庫(kù)，及其對(duì)應(yīng)的 Oculus 展示插件。

    讀取傳感器數(shù)據(jù)，顯示到虛擬世界中。

    如下圖所示:

    于是找至了對(duì)應(yīng)的 Node 庫(kù)有：Node-HMD，它可以讀取傳感器的數(shù)據(jù)。

    還有 Three.js 和 Oculus Effect 插件，可以顯示出下面的視圖：

    這樣，我們 DK2 Control 讀取傳感器的數(shù)據(jù)，就可以到這個(gè)虛擬世界玩了~~。

    更詳細(xì)的介紹可以見(jiàn)： https://github.com/phodal/oculus-nodejs-threejs-example

    高級(jí)應(yīng)用: 火星漫游者

    上面的應(yīng)用示例還是太簡(jiǎn)單了，讓我們來(lái)看一個(gè)高級(jí)應(yīng)用——這是我們?cè)趦蓚�(gè)月前做的另外一個(gè) Hackday Idea，這是另外一個(gè)“火星漫游者”：

    想象一下你想去看看火星，但是你又沒(méi)有錢(qián)去。而你可以租用這樣的一個(gè)機(jī)器人，然后你就可以在火星漫游了。

    因此，首先我們需要一個(gè)實(shí)時(shí)視頻通訊，這里我們就用到了 WebRTC:

    通過(guò) WebRTC 我們就可以在計(jì)算機(jī)瀏覽器上實(shí)現(xiàn)實(shí)時(shí)通訊，再通過(guò) Three.js 就可以將這個(gè)視頻轉(zhuǎn)為一個(gè)近似 3D 的視角。而捕獲這個(gè)視頻即可以通過(guò)手機(jī)上的瀏覽器，也可以在手機(jī)上編寫(xiě)相應(yīng)的 Web 應(yīng)用。

    這里有一個(gè)在線的 Demo：http://laht.info/WebGL/DK2Demo.html

    架構(gòu)大致如下圖所示：

    這樣我們就解決了實(shí)時(shí)視頻這個(gè)問(wèn)題，然后我們還需要去控制硬件：

    用 WebSocket 協(xié)議來(lái)提供 Oculus 的上、下、左、右運(yùn)動(dòng)的數(shù)據(jù)

    在手機(jī)上讀取這個(gè)傳感器數(shù)據(jù)，并將這個(gè)數(shù)據(jù)通過(guò) BLE 傳送到小車(chē)上。

    小車(chē)以通過(guò)指令來(lái)做相應(yīng)的運(yùn)動(dòng)。

    關(guān)于這部分內(nèi)容的可以看我之前的那篇文章《我是如何 Hack 一個(gè)機(jī)器人的？》

    總結(jié): All in javascript

    與C坑坑（C++）相比，javascript 更適合搭建原型——快速、直接、有效，畢竟 C++ 編譯需要時(shí)間的。運(yùn)行起來(lái)的效果也如預(yù)期的一樣，電腦風(fēng)扇各種轉(zhuǎn)，不知道是不是 Mac 專(zhuān)有的。不過(guò)，我想這個(gè)性能問(wèn)題是一直都有的。