1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
|
---
title: WebVR API
slug: Web/API/WebVR_API
translation_of: Web/API/WebVR_API
---
<div>{{draft("The WebVR API documentation is currently being updated to cover the v1.0 spec, therefore some of this information will be out of date. Contact ~~chrisdavidmills if you have any questions about this work.")}}{{DefaultAPISidebar("WebVR API")}}{{SeeCompatTable}}</div>
<p class="summary">O WebVR oferece suporte para expor dispositivos de realidade virtual - por exemplo, telas montadas na cabeça, como o Oculus Rift - para aplicativos da web, permitindo que os desenvolvedores traduzam informações de posição e movimento da tela para movimento em torno de uma cena 3D. Isso tem inúmeras aplicações muito interessantes, de passeios de produtos virtuais e aplicativos de treinamento interativo para super imersivo jogos em primeira pessoa.</p>
<h2 id="Conceitos_e_uso">Conceitos e uso</h2>
<p><img alt="Sketch of a person in a chair with wearing goggles labelled Head mounted display (HMD) facing a monitor with a webcam labelled Position sensor " src="https://mdn.mozillademos.org/files/11035/hw-setup.png" style="display: block; height: 78px; margin: 0px auto; width: 60%;"></p>
<p>Todos os dispositivos VR ligados ao computador serão devolvidos pelo {{domxref("Navigator.getVRDisplays()")}} método. Que retorna uma matriz de objetos para representar os dispositivos conectados, que herdam do objeto geral {{domxref("VRDevice")}} Geralmente o display usado na cabeça terá dois dispositivos - o próprio display montado na cabeça, representado por {{domxref("HMDVRDevice")}}, e uma câmera com sensor na posição que manterá o controle de sua posição de cabeça, representada por {{domxref("PositionSensorVRDevice")}}.</p>
<p>O objeto {{domxref("PositionSensorVRDevice")}} contém o método {{domxref("PositionSensorVRDevice.getState", "getState()")}}, que retorna um objeto {{domxref("VRPositionState")}} - isto representa o estado do sensor num dado carimbo de data e inclui propriedades que contêm dados úteis tais como velocidade, aceleração e orientação atuais, úteis para atualizar o processamento de uma cena em cada trama de acordo com o movimento do visor montado na cabeça VR.</p>
<p>O método {{domxref("HMDVRDevice.getEyeParameters()")}} retorna um objeto {{domxref("VREyeParameters")}}, que pode ser usado para retornar informações do campo de exibição - quanto da cena a tela montada na cabeça pode ver.O {{domxref("VREyeParameters.currentFieldOfView")}} retorna um objeto {{domxref("VRFieldOfView")}} que contém 4 ângulos que descrevem a vista atual a partir de um ponto central. Você também pode alterar o campo de visualização usando {{domxref("HMDVRDevice.setFieldOfView()")}}.</p>
<div id="gt-res-content">
<h2 class="trans-verified-button-small" dir="ltr" id="WebVR_Interfaces">WebVR Interfaces</h2>
<p class="trans-verified-button-small" dir="ltr">{{domxref("VRDisplay")}}<br>
Representa qualquer dispositivo VR suportado por esta API. Ele inclui informações genéricas, como IDs de dispositivo e descrições, bem como métodos para começar a apresentar uma cena VR, recuperar os parâmetros do olho e exibir capacidades e outras funcionalidades importantes.<br>
{{domxref("VRDisplayCapabilities")}}<br>
Descreve os recursos de um {{domxref("VRDisplay")}} - seus recursos podem ser usados para executar testes de capacidade do dispositivo VR, por exemplo, ele pode retornar informações de posição.<br>
{{domxref("VRPose")}}<br>
Representa o estado de posição em um dado carimbo de data/hora (que inclui orientação, posição, velocidade e aceleração).<br>
{{domxref ("VREyeParameters")}}<br>
Fornece acesso a todas as informações necessárias para processar corretamente uma cena para cada olho, incluindo informações de campo de visão.<br>
{{domxref("VRFieldOfView")}}<br>
Representa um campo de visão definido por 4 valores de graus diferentes que descrevem a vista a partir de um ponto central.<br>
{{Domxref("VRLayer")}}<br>
Representa uma camada a ser apresentada em {{domxref("VRDisplay")}}.<br>
{{domxref("VRStageParameters")}}<br>
Representa os valores que descrevem a área de estágio para dispositivos que suportam experiências em escala de sala.</p>
<h2 class="trans-verified-button-small" dir="ltr" id="Extensões_para_outras_interfaces">Extensões para outras interfaces</h2>
<p class="trans-verified-button-small" dir="ltr">{{domxref("Gamepad.displayId")}} {{readonlyInline}}<br>
Retorna o {{domxref("VRDisplay.displayId")}} do associado {{domxref("VRDisplay")}} - o VRDisplay que o gamepad está controlando a cena exibida de.<br>
{{domxref("Navigator.activeVRDisplays")}} {{readonlyInline}}<br>
Retorna uma matriz contendo todos os objetos {{domxref("VRDisplay")}} que está sendo apresentado ({{domxref("VRDisplay.ispresenting")}}).<br>
{{domxref("Navigator.getVRDisplays()")}}<br>
Retorna uma promessa que resolve uma matriz de objetos {{domxref("VRDisplay")}} que representa qualquer dispositivo VR disponível conectado ao computador.<br>
{{domxref("Window.onvrdisplayconnected")}}<br>
Representa um manipulador de eventos que será executado quando um dispositivo VR compatível tiver sido conectado ao computador (quando o evento {{event("vrdisplayconnected")}} for acionado).<br>
{{domxref("Window.onvrdisplaydisconnected")}}<br>
Representa um manipulador de eventos que será executado quando um dispositivo VR compatível tiver sido desconectado do computador (quando o evento {{event("vrdisplaydisconnected")}} for acionado).<br>
{{domxref("Window.onvrdisplaypresentchange")}}<br>
Representa um manipulador de eventos que será executado quando o estado de apresentação de um dispositivo VR mudar - isto é, vai de apresentar a não apresentar, ou vice-versa (quando o evento {{event("onvrdisplaypresentchange")}} é acionado).</p>
</div>
<h2 id="Examplos">Examplos</h2>
<p>Você pode encontrar uma série de exemplos nesses repositórios Github:</p>
<ul>
<li><a href="https://github.com/aframevr/aframe">A-Frame</a>: Estrutura web de código aberto para a construção de experiências VR. Muitos exemplos.</li>
<li><a href="https://github.com/mdn/webvr-tests">mdn/webvr-tests</a>: Demonstrações simples construídas para ilustrar o uso de recursos básicos.</li>
<li><a href="https://github.com/MozVR/">MozVR team</a>: Mais demonstrações, sobre WebVR e muito mais!</li>
</ul>
<h2 id="Especificações">Especificações</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specificação</th>
<th scope="col">Status</th>
<th scope="col">Comentario</th>
</tr>
<tr>
<td>{{SpecName('WebVR')}}</td>
<td>{{Spec2('WebVR')}}</td>
<td>Initial definition</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilidade_do_Browser_(navegador)">Compatibilidade do Browser (navegador)</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Chrome</th>
<th>Chromium</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari (WebKit)</th>
</tr>
<tr>
<td>
<p>Suporte Básico</p>
</td>
<td>{{CompatNo}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Feature</th>
<th>Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>IE Phone</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
<th>Chrome for Android</th>
<th>Samsung Internet for GearVR</th>
</tr>
<tr>
<td>
<p>Suporte Básico</p>
</td>
<td>{{CompatNo}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="Veja_Também">Veja Também</h2>
<ul>
<li><a href="https://webvr.info">webvr.info</a>- Informações atualizadas sobre WebVR, configuração do navegador e comunidade.</li>
<li><a href="https://iswebvrready.com">webvr.rocks</a>- Informações atualizadas sobre o suporte ao navegador WebVR (incluindo compilações experimentais).</li>
<li><a href="http://mozvr.com/">MozVr.com</a>- Demos, downloads, outros recursos da equipe de VR da Mozilla.</li>
<li><a href="https://aframe.io">A-Frame</a>- A web framework para a construção de experiências VR (com HTML), a partir da equipe Mozilla VR.</li>
<li><a href="http://dsmu.me/ConsoleGameOnWeb/">Console Game on Web</a>- Uma coleção de demonstrações interessantes conceito de jogo, alguns dos quais incluem WebVR.</li>
<li><a href="https://github.com/MozVR/vr-web-examples/tree/master/threejs-vr-boilerplate">threejs-vr-boilerplate</a>- Um modelo de iniciador muito útil para escrever aplicações WebVR.</li>
<li><a href="https://developer.oculus.com/">Oculus Rift homepage</a></li>
</ul>
|
