- krpano WebVR / WebXR / MobileVR 支持::
- WebVR 支持意味着在可用时使用浏览器的 WebVR API 或 WebXR API 在这里,浏览器和系统将执行头部和位置跟踪以及镜头失真。这是最好的质量和性能的情况下,但需要一个系统和浏览器与WebVR/WebXR的支持。
- WebXR注意: WebXR API 的使用可以通过 webxr 嵌入设置来控制。目前WebVR API更受欢迎,因为它更成熟,得到更好的支持,提供了更多的功能和稳定性。
- MobileVR支持意味着对移动设备的“手动”VR支持。当浏览器不支持WebVR或WebXR API时,这将用作回退。这里将使用移动设备的加速度计和陀螺仪传感器进行头部跟踪,并手动完成镜头畸变。为了获得正确的vr视图,可能需要手动调整特定耳机或设备的设置。
- 体验任何全景图像或视频(正常和立体)在3D虚拟现实模式直接在浏览器内。当使用 depthmap-panos 时,还可以使用位置跟踪。
主题
语法
<plugin name="webvr" keep="true"
url="webvr.js"
postracking="auto"
absolute="false"
north="0"
oversampling="1.0"
fullscreen_mirroring="false"
mouse_pointerlock="true"
webvr_highrefreshrate=""
webvr_foveationlevel="1"
webvr_ca_correction=""
mobilevr_support="true"
mobilevr_desktop_support="false"
mobilevr_fake_support="true"
mobilevr_touch_support="false"
mobilevr_profile="80|60|42|35|0.441|0.156"
mobilevr_screensize="auto"
mobilevr_database_support="xml|internal|external"
mobilevr_database_url="https://dpdb.webvr.rocks/dpdb.json"
mobilevr_sensor="1"
mobilevr_sensor_mode="3"
mobilevr_wakelock="true"
flatpanohfov="120.0"
vr_cursor=""
vr_cursor_enabled="true"
vr_cursor_onover=""
vr_cursor_onout=""
vr_controller_support="true"
vr_controller=""
vr_controller_clickbuttons="0,1"
onavailable=""
onunavailable=""
onunknowndevice=""
onvrcontrollers=""
onvrcontrollerbutton=""
onhavepostracking=""
onentervr=""
onexitvr=""
ondenied=""
/>
- isavailable
- isenabled
- iswebvr / iswebxr / ismobilevr / isfake
- isvrbrowser
- vrcontrollers
- havepostracking
- floorlevel
- havesettings
- devicename / devicesize
- renderwidth / renderheight
krpano API 集成
- 加载后,插件对象也将作为全局webvr变量可用。
krpano 事件
除了插件事件之外,插件还调度这些krpano事件:
<events webvr_onavailable=""
webvr_onunavailable=""
webvr_onunknowndevice=""
webvr_onvrcontrollers=""
webvr_onvrcontrollerbutton=""
webvr_onhavepostracking=""
webvr_onentervr=""
webvr_onexitvr=""
webvr_ondenied=""
/>
插件属性
Attribute name | Type | Default value | |
postracking | String | "auto" | |
---|---|---|---|
| |||
Attribute name | Type | Default value | |
absolute | Boolean | false | |
| |||
Attribute name | Type | Default value | |
north | Number | 0.0 | |
| |||
Attribute name | Type | Default value | |
hlookatoffset | Number | 0.0 | |
| |||
Attribute name | Type | Default value | |
oversampling | Number | 1.0 | |
| |||
Attribute name | Type | Default value | |
auto_oversampling | Boolean | true | |
| |||
Attribute name | Type | Default value | |
zoom | Number | 1.0 | |
| |||
Attribute name | Type | Default value | |
friction | Number | 0.0 | |
| |||
Attribute name | Type | Default value | |
headtracking | Boolean | true | |
| |||
Attribute name | Type | Default value | |
fullscreen_mirroring | Boolean | false | |
| |||
Attribute name | Type | Default value | |
mouse_pointerlock | Boolean | true | |
| |||
Attribute name | Type | Default value | |
webvr_highrefreshrate | String | ||
| |||
Attribute name | Type | Default value | |
webvr_foveationlevel | int | 1 | |
| |||
Attribute name | Type | Default value | |
webvr_ca_correction | Boolean | ||
| |||
Attribute name | Type | Default value | |
mobilevr_support | Boolean | true | |
| |||
Attribute name | Type | Default value | |
mobilevr_desktop_support | Boolean | false | |
| |||
Attribute name | Type | Default value | |
mobilevr_fake_support | Boolean | false | |
| |||
Attribute name | Type | Default value | |
mobilevr_touch_support | Boolean | false | |
| |||
Attribute name | Type | Default value | |
mobilevr_profile | String | ||
| |||
Attribute name | Type | Default value | |
mobilevr_screensize | String | "auto" | |
| |||
Attribute name | Type | Default value | |
mobilevr_database_support | String | "xml|internal|external" | |
| |||
Attribute name | Type | Default value | |
mobilevr_database_url | String | ||
| |||
Attribute name | Type | Default value | |
mobilevr_wakelock | Boolean | true | |
| |||
Attribute name | Type | Default value | |
mobilevr_sensor | int | 1 | |
| |||
Attribute name | Type | Default value | |
mobilevr_sensor_mode | int | 3 | |
| |||
Attribute name | Type | Default value | |
flatpanohfov | Number | 120.0 | |
Attribute name | Type | Default value | |
vr_cursor | String | ||
| |||
Attribute name | Type | Default value | |
vr_cursor_enabled | Boolean | true | |
| |||
Attribute name | Type | Default value | |
vr_cursor_onover vr_cursor_onout | Action Event Action Event | ||
Attribute name | Type | Default value | |
vr_controller_support | Boolean | true | |
| |||
Attribute name | Type | Default value | |
vr_controller | String | ||
| |||
Attribute name | Type | Default value | |
vr_controller_clickbuttons | String | "0,1" | |
|
插件状态变量(只读)
Attribute name | Type | Default value | |
isavailable | Boolean | false | |
---|---|---|---|
| |||
Attribute name | Type | Default value | |
isenabled | Boolean | false | |
| |||
Attribute name | Type | Default value | |
iswebvr | Boolean | false | |
| |||
Attribute name | Type | Default value | |
iswebxr | Boolean | false | |
| |||
Attribute name | Type | Default value | |
ismobilevr | Boolean | false | |
| |||
Attribute name | Type | Default value | |
isfake | Boolean | false | |
| |||
Attribute name | Type | Default value | |
isvrbrowser | Boolean | false | |
| |||
Attribute name | Type | Default value | |
vrcontrollers | JS-Array | ||
| |||
Attribute name | Type | Default value | |
havepostracking | Boolean | false | |
| |||
Attribute name | Type | Default value | |
floorlevel | Number | ||
| |||
Attribute name | Type | Default value | |
havesettings | Boolean | false | |
| |||
Attribute name | Type | Default value | |
devicename | String | ||
| |||
Attribute name | Type | Default value | |
devicesize | Number | 0.0 | |
| |||
Attribute name | Type | Default value | |
renderwidth renderheight | int int | 0 0 | |
|
Plugin Events
Attribute name | Type | Default value | |
onavailable | Action Event | ||
---|---|---|---|
| |||
Attribute name | Type | Default value | |
onunavailable | Action Event | ||
| |||
Attribute name | Type | Default value | |
onunknowndevice | Action Event | ||
| |||
Attribute name | Type | Default value | |
onvrcontrollers | Action Event | ||
| |||
Attribute name | Type | Default value | |
onvrcontrollerbutton | Action Event | ||
| |||
Attribute name | Type | Default value | |
onhavepostracking | Action Event | ||
| |||
Attribute name | Type | Default value | |
onentervr | Action Event | ||
| |||
Attribute name | Type | Default value | |
onexitvr | Action Event | ||
| |||
Attribute name | Type | Default value | |
ondenied | Action Event | ||
|
插件操作
enterVR()
- 切换到VR全屏模式。
exitVR()
- 退出VR模式。
toggleVR()
- 切换当前的VR模式状态——根据当前状态,切换到VR模式或退出VR模式。
lookat(hlookat)
- 设置水平方向 (hlookat).
loadSettings() saveSettings() resetSettings()
- 加载或保存MobileVR设置(屏幕大小,配置文件,陀螺仪校准)。
- 设置将只存储在本地浏览器的localStorage中。
- 当调用resetSettings()时,设置存储将被清除。
- 存储仅适用于当前域,由于浏览器限制,跨域存储共享不再可能。
iFrame的支持
当试图使用MobileVR支持在一个“跨起源”iframe(这意味着外部页面和内部iframe页面是在不同的起源/域),然后陀螺的使用(与此同时,VR支持)可能会被浏览器阻止。
为了解决这个限制,可以在外部页面中“捕获”devicemotion事件,并通过postMessage API将其发送到内部iframe。
下面是外部(包含iframe的)网页的Javascript代码示例:
<script>
var pano_iframe_name = "enter_here_the_id_of_your_iframe_element";
window.addEventListener("devicemotion", function(e){ var iframe = document.getElementById(pano_iframe_name); if (iframe) iframe.contentWindow.postMessage({ type:"devicemotion", deviceMotionEvent:{ acceleration:{ x:e.acceleration.x, y:e.acceleration.y, z:e.acceleration.z }, accelerationIncludingGravity:{ x:e.accelerationIncludingGravity.x, y:e.accelerationIncludingGravity.y, z:e.accelerationIncludingGravity.z }, rotationRate:{ alpha:e.rotationRate.alpha, beta:e.rotationRate.beta, gamma:e.rotationRate.gamma }, interval:e.interval, timeStamp:e.timeStamp } }, "*"); });
</script>