Skip to content

aike/paview.js

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

18 Commits
 
 
 
 

Repository files navigation

PaView.js - JavaScript Spherical Movie Viewer

Description

PaView.js is a JavaScript spherical movie viewer program.

How To Use

load script with Three.js

<script type="text/javascript" src="three.min.js"></script>
<script type="text/javascript" src="paview.js"></script>

simple example

<div id="mov1"></div>
<script type="text/javascript" >
    var img1 = new PaView({
        id:'mov1',
        file:'panorama1.mp4',
        srcwidth: 1024,
        srcheight: 512
    });
</script>

with customize option

<div id="mov2"></div>
<script type="text/javascript" >
    var img2 = new PaView({
        id:'mov2',
        file:'panorama2.mp4',
        srcwidth: 1024,
        srcheight: 512,
        firstview:180,
        zoom:100,
        width:700,
        height:400
    });
</script>

Option

keyword description range default
id ID of parent div element (required) - -
file movie file name (required) - -
srcwidth width of movie (required) number -
srcheight height of movie (required) number -
width width of view area number 500
height height of view area number 300
zoom zoom up movie 20..130 70
firstview degree of initial view 0..360 0
degree array of axis angle [x, y, z] [0..360,0..360,0..360] [0,0,0]

Demo Page

http://sound.jp/aike/paview/

NOTE

  • PaView.js available for Chrome, Firefox, IE (Windows), Chrome, Safari (Mac OS).
  • If you have .mp4 and .webm formated movies, Mac OS Firefox is available too.
  • PaView.js requires web server. It does not work from local file.
  • The movie file must be located at same origin.

Credit

PaView.js is licenced under MIT License. Copyright 2014, aike (@aike1000)

About

JavaScript Spherical Movie Viewer

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published