Webxr device api установка

Webxr device api установка

WebXR emulator extension

WebXR emulator extension is a browser extension which helps your WebXR content creation. It enables you to responsively run WebXR applications on your desktop browser without the need of any XR devices.

  • Based on WebXR device API draft issued on 10 October 2019
  • No device specific emulation yet
  • Supports only trigger and squeeze buttons, not other buttons

This extension is built on top of WebExtensions API. It works on Firefox, Chrome, and other browsers supporting the API.

Go to the addon stores to install (Firefox, Chrome)

Go to WebXR application page (for example WebXR examples). You will notice that the application detects that you have a XR device (emulated) and it will let you enter the immersive (VR、AR) mode.

Open «WebXR» tab in the browser developer tool (Firefox, Chrome) to controll the emulated devices. You can move the headset and controllers, and trigger the controller buttons. You will see their transforms reflected in the WebXR application.

WebXR tab

How to control the emulated devices

By clicking a device in the devtool panel, you can select gizmo mode of the device. By dragging a gizmo, you can rotate or translate the device.

You can configure some settings from the top in the WebXR tab.

You can switch emulated device. The difference between devices is just degrees of freedom and the number of controllers for now.

Device Description
None No device
Google Cardboard 3dof headset and no controller
HTC Vive 6dof headset and two 6dof controllers
Oculus Go 3dof headset and 3dof controller
Oculus Quest 6dof headset and two 6dof controllers
Samsung Gear VR 3dof headset and 3dof controller

You can enable/disable Stereo Effect which renders two views.

WebXR emulator extension also supports AR. You can test WebXR AR application on an emulated device in a virtual room, on your desktop browser.

Select «Samsung Galaxy S8+ (AR)» device from the device list on the top of WebXR devtool panel

Go to WebXR application page, for example Three.js WebXR AR examples

You will notice that the application detects that you have a XR device (emulated) and it will let you enter the immersive (AR) mode

AR application starts on the emulated device in a virtual room

You can control the camera (view) and tablet in the application window.

user action camera/tablet control
Left mouse button drag Camera rotation
Right mouse button drag Camera pan
Middle mouse button drag or wheel Move camera forward/backward
Mouse click on the tablet Change the tablet gizmo mode
Gizmo on the tablet Tablet rotation/translation
Right mouse button click on the tablet screen touch input

How to control in the devtool panel

You can still control the camera and tablet in the devtool panel similar to VR.

Devtool panel AR virtual room
Camera View
Right controller Finger (not shown in the application window)
Left controller Tablet

How to install the newest version

If you want to develop or debug this extension or if you want to use the under development (not released yet) version, download this repositoy and install the extension into your browser as developer mode. (Firefox, Chrome)

How to build polyfill/webxr-polyfill.js

polyfill/webxr-polyfill.js is created with npm.

  • Even if native WebXR API is available the extension overrides it with WebXR polyfill

Thanks to WebVR-Extension project, it was a true inspiration for us when building this one.


WebXR Device API

WebXR is a group of standards which are used together to support rendering 3D scenes to hardware designed for presenting virtual worlds (virtual reality, or VR), or for adding graphical imagery to the real world, (augmented reality, or AR). The WebXR Device API implements the core of the WebXR feature set, managing the selection of output devices, render the 3D scene to the chosen device at the appropriate frame rate, and manage motion vectors created using input controllers.

WebXR-compatible devices include fully-immersive 3D headsets with motion and orientation tracking, eyeglasses which overlay graphics atop the real world scene passing through the frames, and handheld mobile phones which augment reality by capturing the world with a camera and augment that scene with computer-generated imagery.

To accomplish these things, the WebXR Device API provides the following key capabilities:

  • Find compatible VR or AR output devices
  • Render a 3D scene to the device at an appropriate frame rate
  • (Optionally) mirror the output to a 2D display
  • Create vectors representing the movements of input controls

At the most basic level, a scene is presented in 3D by computing the perspective to apply to the scene in order to render it from the viewpoint of each of the user’s eyes by computing the position of each eye and rendering the scene from that position, looking in the direction the user is currently facing. Each of these two images is rendered into a single framebuffer, with the left eye’s rendered image on the left and the right eye’s viewpoint rendered into the right half of the buffer. Once both eyes’ perspectives on the scene have been rendered, the resulting framebuffer is delivered to the WebXR device to be presented to the user through their headset or other appropriate display device.

WebXR Device API concepts and usage

Example WebXR hardware setup Sketch of a person in a chair with wearing goggles labelled "Head mounted display (HMD)" facing a monitor with a webcam labeled "Position sensor"

While the older WebVR API was designed solely to support Virtual Reality (VR), WebXR provides support for both VR and Augmented Reality (AR) on the web. Support for AR functionality is added by the WebXR Augmented Reality Module.

A typical XR device can have either 3 or 6 degrees of freedom and might or might not have an external positional sensor.

The equipment may also include an accelerometer, barometer, or other sensors which are used to sense when the user moves through space, rotates their head, or the like.

Accessing the WebXR API

To gain access to the WebXR API within the context of a given window, use the navigator.xr (en-US) property, which returns an XRSystem (en-US) object through which the entire WebXR Device APi is then exposed.

navigator.xr (en-US) Только для чтения This property, added to the Navigator interface, returns the XRSystem (en-US) object through which the WebXR API is exposed. If this property is missing or null , WebXR is not available.

Интерфейсы WebXR

Интерфейсы событий WebXR

Следующие интерфейсы представляют события WebXR API.

XRInputSourceEvent (en-US) Sent when the state of an XRInputSource (en-US) changes. This can happen, for example, when the position and/or orientation of the device changes, or when buttons are pressed or released. XRInputSourcesChangeEvent (en-US) Sent to indicate that the set of available input sources has changed for the XRSession (en-US) . XRReferenceSpaceEvent (en-US) Sent when the state of an XRReferenceSpace (en-US) changes. XRSessionEvent (en-US) Sent to indicate that the state of an XRSession (en-US) has changed. For example, if the position and/or orient

Расширения к WebGL API

WebGL API расширяется спецификацией WebXR для того, чтобы дополнить контекст WebGL, чтобы с помощью него можно было отрисовывать изображение для отображения на устройствах WebXR.

WebGLRenderingContextBase.makeXRCompatibile() Настраивает контекст WebGL для совместимости с WebXR. Если при создании контекста опция xrCompatible не была установлена как true , необходимо вызвать метод makeXRCompatible() до использования контекста WebGL для рендеринга WebXR. Возвращает Promise , выполняющийся, когда контекст был подготовлен, или отклонён, если контекст не может быть настроен для работы с WebXR.

Руководства и уроки

Следующие руководства и уроки помогут вам изучить, как работает WebXR и низкоуровневые функции 3D и VR/AR графики.


WebXR API — новые технологии в сфере браузерного VR

Браузеры современного типа становятся все более и более сложными, а также все сильнее и прочнее интегрируют в свой функционал некоторые действительно особенности и технологии – к примеру, новые алгоритмы построения работы приложений и оборудования виртуальной и дополненной реальности. В отличие от традиционного сегмента разработки игр, где необходимо постоянно искать идеальный баланс между функционалом устройства и конечной его стоимостью, в сегменте веб-разработки подобные идеи и проекты воплощать куда легче. В первую очередь потому, что абсолютно все алгоритмы можно встраивать прямо в браузер – чем и занимается Google Project Stream.

Это отдельная команда компании Google, которая уже некоторое время работает над созданием и интеграцией новых типов протоколов и алгоритмов API для улучшения текущего концепта и типа приложений виртуальной и дополненной реальности. Результатом их долгого и плодотворного труда стал новый тип протоколов под обозначением WebXR Device API, который представляет собой действительно интересный подход к организации нового типа соединений браузера с устройствами виртуальной и дополненной реальности.

По сути, проект предлагает конечному пользователю довольно простую и в то же время эффективную схему использования возможностей VR/AR-устройств в браузере, при которой пользователь просто подключает устройство к компьютеру и активирует его в браузере. Больше ничего не нужно – по крайней мере, на момент наличия текущего тестового билда. Стоит заметить, что изначально сотрудники Google Project Stream предполагали несколько расширить начальный функционал своей совокупности алгоритмов и протоколов API.

Однако ввиду того, что последующая ревизия и проверка Google постановила несколько сократить проект и сделать его чуть более узконаправленным, им пришлось сосредоточиться на браузерной интеграции прежде всего. В принципе, такой осторожный подход со стороны Google более чем обоснован, так как она в первую очередь заинтересована в том, чтобы протестировать некоторые дополнительные возможности своего нового детища в сфере браузерного VR.


WebXR Device API: доступны черновые спецификации

Консорциум стандартизации веб-технологий W3C добился прогресса в дополненной и виртуальной реальности для интернета, опубликовав черновые спецификации WebXR Device API. Они «описывают поддержку доступа через интернет к устройствам виртуальной реальности и дополненной реальности, включая датчики и размещаемые на голове дисплеи». При работе с созданным на WebGL трёхмерным контентом API может превращать обычные URL или веб-адреса в порталы в другие миры.

Большинство разработчиков создаёт интерактивные виртуальные миры на таких движках, как Unreal и Unity. Программисты часто пишут основную логику на C#. WebXR (основанный на более раннем WebVR) открывает разработку дополненной и виртуальной реальности людям, знакомым с веб-инструментами, такими как Amazon Sumerian, или языками наподобие Javascript.

API-интерфейс WebXR для устройств предоставит дополненной и виртуальной реальности первую возможность помогать людям в масштабах Сети, — поясняет Тревор Флауэрс (Trevor Flowers), председатель Immersive Web Community Group в составе W3C. — Будет удивительно наблюдать, как миллионы веб-разработчиков по всему миру используют свои навыки для расширения границ интернета.

Новый интерфейс прикладного программирования WebXR по-прежнему нестабилен и нуждается в дальнейшей доработке. В конце концов он может стать ещё одним стандартом W3C. Этому способствует его универсальность: к примеру, для дополненной реальности API может работать очками на основе прозрачных и непрозрачных дисплеев, в которых изображение формируется опосредованно, с камер.

Авторами черновика выступили члены рабочей группы Immersive Web в W3C Брэндон Джонс (Brandon Jones) из Google и Нелл Валичек (Nell Waliczek) из Amazon.

Не пропускайте важнейшие новости о дополненной, смешанной и виртуальной реальности — подписывайтесь на Голографику в Telegram, ВК, Twitter и Facebook!

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.


Читайте также:  Водонагреватель ariston горизонтальной установки