Electroteque Media

Quest multiview rendering

Multiview support for headsets and browsers that support layers and the extension

This example demonstrates rendering using the Multiview layers extension supported with Quest headsets. This will improve rendering performance. A frame buffer scale is added to upscale textures and questAutoVRSession will auto launch to WebXR when clicking the player.

    <div class="flex w-full h-auto my-auto">
      <video class="video-js vjs-default-skin vjs-fluid " crossorigin="anonymous" controls="" id="multiview"></video>
  </div>

  <script type="text/javascript">

  	var player = videojs("multiview", {
    "plugins": {
        "vrvideo": {
            "antialias": true,
            "frameBufferScale": 1.5,
            "multiview": true,
            "questAutoVRSession": true
        }
    },
    "sources": [
        {
            "src": "//videos.electroteque.org/360/ultra_light_flight_720p.webm",
            "type": "video/webm"
        },
        {
            "src": "//videos.electroteque.org/360/ultra_light_flight_720p.mp4",
            "type": "video/mp4"
        },
        {
            "src": "//videos.electroteque.org/360/ultra_light_flight_720p.ogv",
            "type": "video/ogg"
        }
    ]
});

  </script>