使用 JavaScript 進行 WebXR 開發
JavaScript 是世界各地最受歡迎的程式設計語言之一! 它是簡單、輕量且廣泛使用於網路上。 利用 JavaScript 和 Web 技能的強大功能,建立更吸引人的Mixed Reality體驗。
在網路上Mixed Reality應用程式
Mixed Reality功能可透過WebXR 在網路上取得。 您可以在相容的 WebXR) 瀏覽器中看到虛擬實境 (VR) 和擴增實 (境,而不需安裝任何其他軟體或外掛程式。 您可以將該相同的瀏覽器與實體裝置搭配使用,例如HoloLens 2。
WebXR 裝置 API適用于存取虛擬實境 (VR) 和擴增實境, (AR) 裝置,包括感應器和前端掛接顯示器。 Microsoft Edge 和 Chrome 版本 79 上提供 WebXR 裝置 API,而更新版本預設支援 WebXR。 您可以在 caniuse.com檢查 WebXR 的最新瀏覽器支援狀態。
注意
WebVR 已被取代,目前瀏覽器無法使用,因此不應該用於任何新的開發。 您必須將任何現有的 WebVR 實作轉送到 WebXR。
WebXR 功能 | 可用性 |
---|---|
WebXR 裝置 API (w3.org) | Windows 桌面上的 Edge 81 Hololens 2 上的 Edge 91 |
WebXR 擴增實境模組 - 層級 1 (w3.org) | Edge 91。 僅限 Hololens 2 |
WebXR 手部輸入模組 - 層級 1 (w3.org) | Edge 93。 僅限 Hololens 2 |
WebXR 錨點模組 (immersive-web.github.io) | Edge 93。 僅限 Hololens 2 |
WebXR 點擊測試模組 (immersive-web.github.io) | Edge 93。 僅限 Hololens 2 |
檢視 WebXR
您可以使用新的 Microsoft Edge和Firefox Reality瀏覽器,在 Windows Mixed Reality 中檢視 WebXR 體驗。 若要測試瀏覽器是否支援 WebXR,您可以在瀏覽器中流覽至 WebXR 範例 。
我可以使用什麼來開發沉浸式 Web 體驗?
下列清單顯示 JavaScript 架構和 API,用於建置目前占市且廣泛接受並採用混合實境 JavaScript 開發人員的沉浸式體驗:
Framework | 範例 |
---|---|
Babylon.js Babylon 是 JavaScript 3D 引擎,可讓您輕鬆地開發 3D 內容和沉浸式應用程式。 開始使用沉浸式應用程式之前,建議您先瞭解Babylon.js開發的基本概念。 - 瞭解如何使用 Babylon.js建置 3D 應用程式: 使用者入門 - 使用Babylon.js播放 3D 範例及其原始程式碼: 遊樂場 - 深入瞭解 WebXR - 瞭解如何開始使用我們的教學課程:建立您的第一個「Hello World!」 應用程式 |
|
A-Frame 框架是一種宣告式 JavaScript 架構,可讓您在網路上開始使用虛擬實境。 若要深入瞭解,請參閱 A-Frame 檔 |
|
Three.js Three.js是建立沉浸式體驗的熱門 3D 程式庫。 深入瞭解 three.js 和 探索範例。 |
|
WebGL 您可以使用 WebGL API 直接存取 WebXR 裝置 API。 WebGL (Web 圖形庫) 是 JavaScript API,可在任何相容的網頁瀏覽器中轉譯高效能的互動式 3D 和 2D 圖形,而不需使用外掛程式。 |
另請參閱
- WebXR 裝置 API 規格
- WebXR 裝置 API 檔
- WebXR 範例
- Immersiveweb.dev
- 使用 Babylon.js 建立 WebXR 體驗
- WebGL API
- 遊戲台 API 和 遊戲台延伸模組
- Windows Mixed Reality和新的 Microsoft Edge
- 處理 WebGL 中遺失的內容
- Pointerlock
- glTF
- 沈浸式 Web 社群群組
- 沈浸式 Web W3C Github