360° Video Player
To display 360-degree videos with gryosensor support, there exists the 360-player.
Getting started
Open the url in your browser and set an 360-degree video file for the source GET-parameter: https://360player.rooom.io/?source=https://path.to/video.mp4
Customization
Parameters
| Name | Type | Default | Description |
|---|---|---|---|
| source | string | '' | REQUIRED URL for 360° video source |
| sourceHQ | string | '' | URL for high quality 360° video source |
| videoType | string | monoscopic | Video type (monoscopic or horizontal or vertical) |
| volume | number | 1 | Sound volume from 0...1 |
| muted | boolean | true | mute the video initially |
| loop | boolean | true | loop video playback |
| fov | number | 45 | field of view in degree |
| rotation | number | 180 | initial horizontal rotation in degrees |
| sensors | boolean | true | enable sensor based orientation |
| vr | boolean | true | enable vr mode (needs sensors to be enabled too) |
| camera | string | free | default camera mode on startup (free or sensors or vr) |
| extraPanning | boolean | true | enable horizontal panning in sensor or vr mode |
| showLogo | boolean | true | Show Logo |
| logo | string | '' | URL for logo image. Shows rooom logo if unspecified |
| logoUrl | string | '' | URL for logo link |
| preview | string | '' | URL for preview image |
| primaryColor | string | '' | Hex-code for primary color (eg. 00AEB3). Uses rooom colorscheme if unspecified |
| theme | string | light | Force Theme to be light, dark or auto |
Embed player
This code snippet can be used to embed the 360-player into other web pages.
<iframe
id="rooom-360-player"
title="rooom-viewer"
frameborder="0"
allowvr="yes"
allow="vr"
allowfullscreen=""
mozallowfullscreen="true"
webkitallowfullscreen="true"
xr; accelerometer; magnetometer; gyroscope; autoplay
src="https://360player.rooom.io/
?source=https://cdn.bitmovin.com/content/assets/playhouse-vr/progressive.mp4
&ui_color=003245"
>
</iframe>