Tämän artikkelin käännös on keskeneräinen. Auta kääntämään tämä artikkeli suomeksi.
This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
WebVR -rajapinta tarjoaa tuen VR-laitteiden — kuten Oculus Rift tai HTC Vive -silmikoiden — käyttämiseen webbisovelluksille, jolloin kehittäjät voivat muuttaa silmikolta saadun sijainti- ja liiketiedon 3D-skenessä liikkumistiedoksi. Tämä mahdollistaa useita kiinnostavia sovellusmahdollisuuksia aina virtuaalisista tuote-esittelyistä ja interaktiivisista treenisovelluksista immersiivisiin FPS-räiskintäpeleihin.
Perusperiaatteet ja käyttö
Metodi Navigator.getVRDisplays() hakee kaikki tietokoneeseen liitetyt VR-laitteet; jokaista näistä vastaa VRDisplay -tyyppinen objekti.
VRDisplay on perusrajapinta WebVR API:in — sen ominaisuuksien ja metodien avulla voit esimerkiksi:
- Hakea tiedot näyttölaitteen tunnistamiseen, sen ominaisuudet ja siihen liitetyt ohjaimet.
- Hakea kunkin näytettäväksi tarkoitetun sisältöruudun
frame dataja toimittaa ruudut näytölle oikealla taajuudella. - Käynnistää ja pysäyttää näyttämisen.
Tyypillinen (yksinkertainen) WebVR-sovellus toimisi esimerkiksi näin:
Navigator.getVRDisplays()-metodilla haetaan viittaus VR-näyttöön.VRDisplay.requestPresent()-metodilla käynnistetään näyttäminen.- WebVR:n omalla versiolla
VRDisplay.requestAnimationFrame()-methodista suoritetaan sovelluksen renderöintisilmukkaa näytölle sopivalla virkistystaajuudella. - Renderöintisilmukassa haetaan ruudun näyttämiseen tarvittavat tiedot (
VRDisplay.getFrameData()) -metodilla, piirretään näytettävä skene kaksi kertaa — siis kerran molemmille silmille, ja sen jälkeen toimitetaan renderöity näkymä näytölle käyttäjälle näytettäväksi metodilla (VRDisplay.submitFrame()).
Tämän lisäksi WebVR 1.1 lisää useita tapahtumia (event) Window -objektiin, jolloin JavaScriptillä voidaan reagoida näytön tilan muutoksiin.
Huom: APIn toiminnasta löytyy paljon lisätietoa artikkeleista Using the WebVR API ja WebVR Concepts.
Ohjaimien käyttö: WebVR:n yhdistäminen Gamepad API:in
Useissa WebVR-laitekokoonpanoissa silmikon mukana on käytettävissä erillinen ohjain. Ohjaimia voidaan käyttää WebVR-sovelluksissa Gamepad API:n kautta, ja erityisesti Gamepad Extensions API:n, joka lisää mukaan ohjaimen asentotiedon (controller pose), tuntoperusteiset laitteet (haptic actuators) ja muita vastaavia.
Huom: Artikkeli Using VR controllers with WebVR selittää perusteet VR-ohjaimien käytöstä WebVR-sovelluksissa.
WebVR rajapinnat
VRDisplay- Edustaa mitä tahnsa APIn tukemaa VR-laitetta. Siinä on mukana yleistiedot laittesta, kuten laitteen tunnisteet (ID) ja kuvaukset sekä metodit VR-skenen esittämisen käynnistämiseen, silmäparametrien ja näytön ominaisuuksien hakemiseen ja muut olennaiset toiminnat.
VRDisplayCapabilities- Esittää
VRDisplay:n ominaisuudet — näillä voidaan testata, saako laitteelta esimerkiksi sijaintitietoa. VRDisplayEvent- Edustaa WebVR-kohtaisen tapahtuman tapahtumaobjektia (kts. window object extensions alempana).
VRFrameData- Vastaa kaikkea tietoa, mitä yksittäisen VR-skenen ruudun renderöintiin tarvitaan; metodi
VRDisplay.getFrameData()hakee nämä tiedot. VRPose- Edustaa tietyllä ajanhetkellä vallitsevaa sijaintitietoa (johon kuuluvat suunta, sijainti, nopeus ja kiihtyvyys.)
VREyeParameters- Tarjoaa pääsyn kaikkeen tietoon, joka tarvitaan skenen renderöintiin oikein kullekin silmälle, esimerkiksi näkökentän laajuuden.
VRFieldOfView- Näkökenttätieto, joka on määritelty keskipisteestä katsottuna neljällä asteluvulla.
VRLayerInit- Tämä on
VRDisplay-näytöllä esitettävä kuvan eräs taso (layer). VRStageParameters- Huoneskaalaa tukevien laitteiden kanssa käytettävissä sovelluksissa "näyttämöalueen" tiedot löytyvät tästä.
Laajennukset muihin rajapintoihin
WebVR API laajentaa joitakin API-rajapintoja lisäten seuraavat ominaisuudet.
Gamepad
Gamepad.displayIdRead only- Palauttaa liitetyn
VRDisplaytunnisteenVRDisplay.displayId—VRDisplay, jonka skeneä gamepad ohjaa.
Navigator
Navigator.activeVRDisplaysRead only- Palauttaa taulukon, jossa on mukana jokainen
VRDisplay, joka esittää parhaillaan (VRDisplay.ispresentingontrue). Navigator.getVRDisplays()- Palauttaa promise-objektin, joka sisältää taulukon
VRDisplayobjekteja, jotka vastaavat kaikkia tietokoneeseen liitettyjä VR-näyttöjä.
Window-tapahtumat
Window.onvrdisplaypresentchange- Edustaa tapahtumankäsittelijää (event handler), joka suoritetaan, kun VR_näytön esittämistila muuttuu — esimerkiksi tilasta 'esittää' tilaan 'ei esitä' tai päinvastoin (kun tapahtuma
vrdisplaypresentchangesignaloidaan). Window.onvrdisplayconnect- Tämä tapahtumankäsittelijä suoritetaan, kun yhteensopiva VR-näyttö on kytketty tietokoneeseen (tapahtuma
vrdisplayconnect). Window.onvrdisplaydisconnect- Tämä tapahtumankäsittelijä suoritetaan, kun yhteensopiva VR-näyttö irrotetaan tietokoneesta (kun tapahtuma
vrdisplaydisconnectsignaloidaan). Window.onvrdisplayactivate- Edustaa taphtumaa, joka suoritetaan, kun näyttö on valmis esittämään sisältöä (tapahtuma
vrdisplayactivate),esimerkiksi kun silmikko aktivoituu virransäästötilasta tai puetaan päälle. Window.onvrdisplaydeactivate- Tämä tapahtumankäsittelijä suoritetaan, kun näytölle ei voi enää esittää sisältöä (kun tapahtuma
vrdisplaydeactivatesignaloidaan), esimerkiksi syystä, että silmikkonäyttö on siirtynyt virransäästötilaan käyttämättömyyden vuoksi.
Window:n tapahtumat, jotka eivät ole käytettävissä
Seuraavat tapahtumat löytyvät APIn määrittelystä, mutta niiden toteutusta ei tunnu vielä löytyvän mistään selaimista.
Window.onvrdisplayblur- Edustaa tapahtumankäsittelijää, joka suoritetaan kun selain, käyttöjärjestelmä tai VR-laitteisto on keskeyttänyt esittämisen näytölle jostain syystä (tapahtuman
vrdisplayblurjohdosta) — esimerkiksi käytettäessä järjestelmän valikkoa tai selainta. Tarkoitus on estää seurantaa tai VR-kokemuksen menetystä. Window.onvrdisplayfocus- Tämä tapahtumankäsittelijä suoritetaan, kun esittäminen näytöllä palautuu edellisen tapahtuman jälkeen (tapahtumasta
vrdisplayfocus).
Esimerkkejä
Näiltä sivustoilta töydät useita esimerkkejä:
- webvr-tests — hyvin yksinkertaisia esimerkkejä MDN:n WebVR dokumentaation tueksi.
- Carmel starter kit — mukavia yksinkertaisia ja hyvin kommentoituja esimerkkejä, jotka tulevat Carmel:in, Facebookin WebVR-selaimen mukana.
- WebVR.info samples — hieman syvemmälle meneviä esimerkkejä lähdekoodeineen
- WebVR.rocks Firefox demos — demottavia esimerkkejä
- A-Frame homepage — esimerkkejä A-Frame:n käytöstä
Spesifikaatiot
| Specification | Status | Comment |
|---|---|---|
| Gamepad Extensions | Editor's Draft | Määrittää Experimental Gamepad extensions. |
| WebVR 1.1 | Draft | Alkuperäinen |
Selainyhteensopivuus
We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!
| Ominaisuus | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
| Perus | No support[1] | (Yes) | 55 (55)[2] | No support | No support | No support |
| Gamepad -laajennukset | No support | No support | No support[4] | No support | No support | No support |
| Feature | Android | Edge | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android | Samsung Internet for GearVR |
|---|---|---|---|---|---|---|---|---|
| Basic support | No support | No support | No support | No support | No support | No support | (Yes)[3] | (Yes) |
| Gamepad extensions | No support | No support | No support[4] | No support | No support | No support | No support | No support |
[1] API käytettävissä (Available) kaikilla alustoilla lipulla, mutta tällä hetkellä toimii ainoastaan kokeellisessa työpöytäversiossa (experimental version of Chrome) (muut versiot eivät palauta yhtään laitetta metodia Navigator.getVRDisplays() kutsuttaessa).
[2] Tällä hetkellä ainoastaan Windows ja Mac OSX tuki on oletuksena päällä.
[3] Nyt ainoastaan laitteella Google Daydream.
[4] Päällä Firefox Nightly ja Beta -versioissa 55 ja uudempi. Käytetään valinnalla dom.gamepad-extensions.enabled.
Katso myös
- vr.mozilla.org — Mozillan WebVR:n aloitussivu, jossa on demoja, apuohjelmia ja muuta tietoa.
- A-Frame — Open source web-sovelluskehys VR-kokemuksien rakentamiseen.
- webvr.info — Ajantasaista tietoa WebVR:stä, selaintuesta ja yhteisöstä.
- MozVr.com — Demoja, latauslinkkejä ja muuta Mozillan VR-ryhmän tarjoamia resursseja.
- threejs-vr-boilerplate — Käyttökelpoinen mallipohja, jonka päälle WebVR-sovellus on helppo rakentaa.
- Web VR polyfill — JavaScript -toteutus WebVR:n toiminnoista.