PanoViewer

Video.js with view360

+ view360

You can use video.js with view360.

projection: EQUIRECTANGULAR

source: https://www.youtube.com/watch?v=I3W1kyp9Jpc

Mute
Current Time 0:17
/
Duration Time 1:09
Loaded: 0%
Progress: 0%
Stream TypeLIVE
Remaining Time -0:51
 
Playback Rate
1
    Chapters
    • Chapters
    Subtitles
    • subtitles off
    Captions
    • captions off
    var video = document.querySelector(".viewer video");
    
    videojs("video").ready(function () {
        var videoContainer = document.querySelector("#video");
        var view360Container = document.createElement("div");
    
        view360Container.className = "container2";
        videoContainer.insertBefore(view360Container, videoContainer.firstChild);
        video.style.display = "none";
    
        var panoViewer = new eg.view360.PanoViewer(view360Container,
            {
                video: video,
                projectionType: "equirectangular",
                useZoom: false,
            }
        );
        window.addEventListener("resize", function() {
            panoViewer.updateViewportDimensions();
        });
    });