new PhotoSphereViewer( options )

Description

Viewer class

Parameters
Name Type Description
options Object

see http://photo-sphere-viewer.js.org/#options

Fires

Triggered when the panorama image has been loaded and the viewer is ready to perform the first render

Throws

when the configuration is incorrect

Details

Members


<static, readonly> DEFAULTS :Object

Default options, see http:\\/\\/photo-sphere-viewer.js.org/#options

Details
Object

<static, readonly> Error

exposes PSVError

Details

<static, readonly> ICONS :Object.<string, string>

SVG icons sources

Details
Object.<string, string>

<static, readonly> TEMPLATES :Object.<string, string>

doT.js templates

Details
Object.<string, string>

<static, readonly> Utils :object

exposes PSVUtils

Details
object

<readonly> config :Object

Configuration object

Details
Object

<readonly> container :HTMLElement

Main container

Details
HTMLElement

<readonly> hud :module:components.PSVHUD


<readonly> loader :module:components.PSVLoader



<readonly> notification :module:components.PSVNotification


<readonly> overlay :module:components.PSVOverlay


<readonly> panel :module:components.PSVPanel


<readonly> parent :HTMLElement

Top most parent

Details
HTMLElement

<readonly> prop :Object

Internal properties

Properties
Name Type Description
needsUpdate boolean

if the view needs to be renderer

isCubemap boolean

if the panorama is a cubemap

position PhotoSphereViewer.Position

current direction of the camera

direction THREE.Vector3

direction of the camera

anim_speed float

parsed animation speed (rad/sec)

zoom_lvl int

current zoom level

vFov float

vertical FOV

hFov float

horizontal FOV

aspect float

viewer aspect ratio

move_speed float

move speed (computed with pixel ratio and configuration move_speed)

moving boolean

is the user moving

zooming boolean

is the user zooming

start_mouse_x int

start x position of the click/touch

start_mouse_y int

start y position of the click/touch

mouse_x int

current x position of the cursor

mouse_y int

current y position of the cursor

mouse_history Array.<Array>

list of latest positions of the cursor, [time, x, y]

gyro_alpha_offset int

current alpha offset for gyroscope controls

pinch_dist int

distance between fingers when zooming

main_reqid

animationRequest id of the main event loop

orientation_cb function

update callback of the device orientation

autorotate_cb function

update callback of the automatic rotation

animation_promise Promise

promise of the current animation (either go to position or image transition)

loading_promise Promise

promise of the setPanorama method

start_timeout

timeout id of the automatic rotation delay

dblclick_data PhotoSphereViewer.ClickData

temporary storage of click data between two clicks

dblclick_timeout

timeout id for double click

cache Array.<PhotoSphereViewer.CacheItem>

cached panoramas

size PhotoSphereViewer.Size

size of the container

pano_data PhotoSphereViewer.PanoData

panorama metadata

Details
Object

<readonly> tooltip :module:components.PSVTooltip

Methods


animate( options [, speed ] ) → {PSVAnimation}

Rotates the view to specific longitude and latitude with a smooth animation

Parameters
Name Type Attributes Description
options PhotoSphereViewer.AnimateOptions
speed string | int <optional>

animation speed or duration (in milliseconds)

Returns

change( name, value [, ...arguments ] ) → {*}

Triggers an event on the viewer and returns the modified value

Parameters
Name Type Attributes Description
name string
value *
arguments * <optional>
<repeatable>
Returns

cleanSphereCorrection( sphere_correction )

Clean a SphereCorrection object

Parameters
Name Type Description
sphere_correction PhotoSphereViewer.SphereCorrection

mutated


clearPanoramaCache( [ panorama ] )

Removes a panorama from the cache or clears the entire cache

Parameters
Name Type Attributes Description
panorama string <optional>
Throws

when the cache is disabled


destroy()

Destroys the viewer

Description

The memory used by the ThreeJS context is not totally cleared. This will be fixed as soon as possible.


getPanoramaCache( panorama ) → {PhotoSphereViewer.CacheItem}

Retrieves the cache for a panorama

Parameters
Name Type Description
panorama string
Throws

when the cache is disabled


getPosition() → {PhotoSphereViewer.Position}

Returns the current position of the camera


getSize() → {PhotoSphereViewer.Size}

Returns the current viewer size


getZoomLevel() → {int}

Returns the current zoom level

Returns

isAutorotateEnabled() → {boolean}

Checks if the automatic rotation is enabled

Returns

isExtendedPosition( object ) → {boolean}

Checks if an object is a {PhotoSphereViewer.ExtendedPosition}, ie has x/y or longitude/latitude

Parameters
Name Type Description
object object
Returns

isFullscreenEnabled() → {boolean}

Checks if the viewer is in fullscreen

Returns

isGyroscopeEnabled() → {boolean}

Checks if the gyroscope is enabled

Returns

isStereoEnabled() → {boolean}

Checks if the stereo viewx is enabled

Returns

load() → {Promise}

Starts to load the panorama

Returns
Throws

when the panorama is not configured

Details

lockOrientation()

Tries to lock the device in landscape or display a message


needsUpdate()

Flags the view has changed for the next render


off( name [, callback ] ) → {PhotoSphereViewer}

Removes an event listener from the viewer

Parameters
Name Type Attributes Description
name string | Object.<string, function()>

event name or events map

callback function <optional>

on( name [, callback ] ) → {PhotoSphereViewer}

Attaches an event listener on the viewer

Parameters
Name Type Attributes Description
name string | Object.<string, function()>

event name or events map

callback function <optional>

once( name [, callback ] ) → {PhotoSphereViewer}

Attaches an event listener called once on the viewer

Parameters
Name Type Attributes Description
name string | Object.<string, function()>

event name or events map

callback function <optional>

preloadPanorama( panorama ) → {Promise}

Preload a panorama file without displaying it

Parameters
Name Type Description
panorama string
Returns
Throws

when the cache is disabled


render()

Performs a render


resize( size )

Resizes the viewer

Parameters
Name Type Description
size PhotoSphereViewer.CssSize

rotate( position [, ignoreRange ] )

Rotates the view to specific longitude and latitude

Parameters
Name Type Attributes Default Description
position PhotoSphereViewer.ExtendedPosition
ignoreRange boolean <optional>
false

ignore longitude_range and latitude_range

Fires

Triggered when the view longitude and/or latitude changes


setPanorama( path [, options [, transition ] ] ) → {Promise}

Loads a new panorama file

Description

Loads a new panorama file, optionally changing the camera position and activating the transition animation.
If the "position" is not defined, the camera will not move and the ongoing animation will continue
"config.transition" must be configured for "transition" to be taken in account

Parameters
Name Type Attributes Default Description
path string | Array.<string>

URL of the new panorama file

options PhotoSphereViewer.PanoramaOptions <optional>
transition boolean <optional>
false
Returns
Throws

when another panorama is already loading


speedToDuration( value, angle ) → {number}

Converts a speed into a duration from current position to a new position

Parameters
Name Type Description
value string | number
angle number
Returns

sphericalCoordsToTextureCoords( position ) → {PhotoSphereViewer.Point}

Converts spherical radians coordinates to pixel texture coordinates

Parameters
Name Type Description
position PhotoSphereViewer.Position

sphericalCoordsToVector3( position ) → {THREE.Vector3}

Converts spherical radians coordinates to a THREE.Vector3

Parameters
Name Type Description
position PhotoSphereViewer.Position
Returns

startAutorotate()

Starts the automatic rotation

Fires

Triggered when the automatic rotation is enabled/disabled


startGyroscopeControl()

Enables the gyroscope navigation if available

Fires

Triggered when the gyroscope mode is enabled/disabled

Throws

if DeviceOrientationControls.js is missing


startKeyboardControl()

Enables the keyboard controls (done automatically when entering fullscreen)


startNoSleep()

Enables NoSleep.js


startStereoView()

Enables the stereo view

Description
  • enables NoSleep.js
  • enables full screen
  • starts gyroscope controle
  • hides hud, navbar and panel
  • instanciate StereoEffect
Throws

if StereoEffect.js is not available


stopAnimation() → {Promise}

Stops the ongoing animation

Description

The return value is a Promise because the is no guaranty the animation can be stopped synchronously.

Returns

Resolved when the animation has ben cancelled


stopAutorotate()

Stops the automatic rotation

Fires

Triggered when the automatic rotation is enabled/disabled


stopGyroscopeControl()

Disables the gyroscope navigation

Fires

Triggered when the gyroscope mode is enabled/disabled


stopKeyboardControl()

Disables the keyboard controls (done automatically when exiting fullscreen)


stopNoSleep()

Disables NoSleep.js


stopStereoView()

Disables the stereo view


textureCoordsToSphericalCoords( point ) → {PhotoSphereViewer.Position}

Converts pixel texture coordinates to spherical radians coordinates

Parameters
Name Type Description
point PhotoSphereViewer.Point

toggleAutorotate()

Starts or stops the automatic rotation


toggleFullscreen()

Enters or exits the fullscreen mode


toggleGyroscopeControl()

Enables or disables the gyroscope navigation


toggleStereoView()

Enables or disables the stereo view


trigger( name [, ...arguments ] ) → {uEvent.Event}

Triggers an event on the viewer

Parameters
Name Type Attributes Description
name string
arguments * <optional>
<repeatable>
Returns

unlockOrientation()

Unlock the device orientation


vector3ToSphericalCoords( vector ) → {PhotoSphereViewer.Position}

Converts a THREE.Vector3 to spherical radians coordinates

Parameters
Name Type Description
vector THREE.Vector3

vector3ToViewerCoords( vector ) → {PhotoSphereViewer.Point}

Converts a THREE.Vector3 to position on the viewer

Parameters
Name Type Description
vector THREE.Vector3

viewerCoordsToVector3( viewerPoint ) → {THREE.Vector3}

Converts position on the viewer to a THREE.Vector3

Parameters
Name Type Description
viewerPoint PhotoSphereViewer.Point
Returns

zoom( level )

Zooms to a specific level between max_fov and min_fov

Parameters
Name Type Description
level int

new zoom level from 0 to 100

Fires

Triggered when the zoom level changes


zoomIn()

Increases the zoom level by 1


zoomOut()

Decreases the zoom level by 1

Type Definitions


AnimateOptions

Object defining animation options

Properties
Name Type Description
zoom number

target zoom level between 0 and 100


CacheItem

An entry in the memory cache

Properties
Name Type Description
panorama string
image THREE.Texture
pano_data PhotoSphereViewer.PanoData
Details
Object

ClickData

Data of the click event

Properties
Name Type Attributes Description
client_x int

position in the browser window

client_y int

position in the browser window

viewer_x int

position in the viewer

viewer_y int

position in the viewer

longitude float

position in spherical coordinates

latitude float

position in spherical coordinates

texture_x int

position on the texture

texture_y int

position on the texture

marker PSVMarker <optional>

clicked marker

Details
Object

CssSize

Object defining a size in CSS (px, % or auto)

Properties
Name Type Attributes Description
width string <optional>
height string <optional>
Details
Object

ExtendedPosition

Object defining a spherical or texture position

Description

A position that can be expressed either in spherical coordinates (radians or degrees) or in texture coordinates (pixels)

Properties
Name Type Description
x int
y int

PanoData

Crop information of the panorama

Properties
Name Type Description
full_width int
full_height int
cropped_width int
cropped_height int
cropped_x int
cropped_y int
Details
Object

PanoramaOptions

Object defining panorama and animation options

Properties
Name Type Description
sphere_correction PhotoSphereViewer.SphereCorrection

new sphere correction to apply to the panorama


Point

Object defining a point

Properties
Name Type Description
x int
y int
Details
Object

Position

Object defining a spherical position

Properties
Name Type Description
longitude float
latitude float
Details
Object

Size

Object defining a size

Properties
Name Type Description
width int
height int
Details
Object

SphereCorrection

Properties
Name Type Description
pan number
tilt number
roll number
Details
Object

Events


autorotate

Triggered when the automatic rotation is enabled/disabled

Parameters
Name Type Description
enabled boolean

before-render

Triggered before a render, used to modify the view

Parameters
Name Type Description
timestamp int

time provided by requestAnimationFrame


click

Triggered when the user clicks on the viewer (everywhere excluding the navbar and the side panel)

Parameters
Name Type Description
data PhotoSphereViewer.ClickData

dblclick

Triggered when the user double clicks on the viewer. The simple click event is always fired before dblclick

Parameters
Name Type Description
data PhotoSphereViewer.ClickData

fullscreen-updated

Triggered when the fullscreen mode is enabled/disabled

Parameters
Name Type Description
enabled boolean

gyroscope-updated

Triggered when the gyroscope mode is enabled/disabled

Parameters
Name Type Description
enabled boolean

panorama-cached

Triggered when a panorama is stored in the cache

Parameters
Name Type Description
panorama string

panorama-load-progress

Triggered while a panorama image is loading

Parameters
Name Type Description
panorama string
progress int

panorama-loaded

Triggered when a panorama image has been loaded


position-updated

Triggered when the view longitude and/or latitude changes

Parameters
Name Type Description
position PhotoSphereViewer.Position

ready

Triggered when the panorama image has been loaded and the viewer is ready to perform the first render


render

Triggered on each viewer render, this event is triggered very often


size-updated

Triggered when the viewer size changes

Parameters
Name Type Description
size PhotoSphereViewer.Size

stereo-updated

Triggered when the stereo view is enabled/disabled

Parameters
Name Type Description
enabled boolean

zoom-updated

Triggered when the zoom level changes

Parameters
Name Type Description
zoomLevel int