Photo
Panoramax.components.ui.Photo ⇐ photo-sphere-viewer.core.Viewer
Kind: static class of Panoramax.components.ui
Extends: photo-sphere-viewer.core.Viewer
Emits: picture-loading
, picture-preview-started
, picture-preview-stopped
, view-rotated
, picture-loaded
, picture-tiles-loaded
, transition-duration-changed
, sequence-playing
, sequence-stopped
, pictures-navigation-changed
, ready
- .Photo ⇐
photo-sphere-viewer.core.Viewer
- new Photo(parent, container, [options])
- .getPictureMetadata() ⇒
object
- .getPictureId() ⇒
string
|null
- .goToNextPicture()
- .goToPrevPicture()
- .goToPosition(lat, lon) ⇒
Promise
- .getXY() ⇒
object
- .getXYZ() ⇒
object
- .getPictureOriginalHeading() ⇒
number
- .getPictureRelativeHeading() ⇒
number
- .clearPictureMetadataCache()
- .setXYZ(x, y, z)
- .setHigherContrast(enable)
- .getTransitionDuration() ⇒
number
- .setTransitionDuration(value)
- .showErrorOverlay(e, label, dissmisable)
- .playSequence()
- .stopSequence()
- .isSequencePlaying() ⇒
boolean
- .toggleSequencePlaying()
- .getPicturesNavigation() ⇒
string
- .setPicturesNavigation(pn)
- .forceRefresh()
- "ready"
- "picture-loading"
- "picture-preview-started"
- "picture-preview-stopped"
- "view-rotated"
- "picture-loaded"
- "picture-tiles-loaded"
- "transition-duration-changed"
- "sequence-playing"
- "sequence-stopped"
- "pictures-navigation-changed"
new Photo(parent, container, [options])
Photo is the component showing a single picture. It uses Photo Sphere Viewer as a basis, and pre-configure dialog with STAC API.
Note that all functions of PhotoSphereViewer Viewer class are available as well.
Param | Type | Default | Description |
---|---|---|---|
parent | Panoramax.components.core.basic |
The parent view | |
container | Element |
The DOM element to create into | |
[options] | object |
The viewer options. Can be any of Photo Sphere Viewer options | |
[options.transitionDuration] | number |
The number of milliseconds the transition animation should be. | |
[options.position] | Array.<number> |
Initial geographical coordinates (as [latitude, longitude]) to find picture nearby. Only used if no picture ID is set. | |
[options.shouldGoFast] | function |
Function returning a boolean to indicate if we may skip loading HD images. | |
[options.picturesNavigation] | string |
"any" |
The allowed pictures navigation ("any": no restriction, "seq": only pictures in same sequence, "pic": only selected picture) |
Example
photo.getPictureMetadata() ⇒ object
Access currently shown picture metadata
Kind: instance method of Photo
Returns: object
- Picture metadata
photo.getPictureId() ⇒ string
| null
Get current picture ID, or loading picture ID if any.
Kind: instance method of Photo
Returns: string
| null
- Picture ID (current or loading), or null if none is selected.
photo.goToNextPicture()
Displays next picture in current sequence (if any)
Kind: instance method of Photo
Throws:
Error
If no picture is selected, or no next picture available
photo.goToPrevPicture()
Displays previous picture in current sequence (if any)
Kind: instance method of Photo
Throws:
Error
If no picture is selected, or no previous picture available
photo.goToPosition(lat, lon) ⇒ Promise
Displays in viewer a picture near to given coordinates
Kind: instance method of Photo
Fulfil: string
Picture ID if picture found
Reject: Error
If no picture found
Param | Type | Description |
---|---|---|
lat | number |
Latitude (WGS84) |
lon | number |
Longitude (WGS84) |
photo.getXY() ⇒ object
Get 2D position of sphere currently shown to user
Kind: instance method of Photo
Returns: object
- Position in format { x: heading in degrees (0° = North, 90° = East, 180° = South, 270° = West), y: top/bottom position in degrees (-90° = bottom, 0° = front, 90° = top) }
photo.getXYZ() ⇒ object
Get 3D position of sphere currently shown to user
Kind: instance method of Photo
Returns: object
- Position in format { x: heading in degrees (0° = North, 90° = East, 180° = South, 270° = West), y: top/bottom position in degrees (-90° = bottom, 0° = front, 90° = top), z: zoom (0 = wide, 100 = zoomed in) }
photo.getPictureOriginalHeading() ⇒ number
Get capture orientation of current picture, based on its GPS.
Kind: instance method of Photo
Returns: number
- Picture original heading in degrees (0 to 360°)
photo.getPictureRelativeHeading() ⇒ number
Computes the relative heading of currently selected picture. This gives the angle of capture compared to sequence path (vehicle movement).
Kind: instance method of Photo
Returns: number
- Relative heading in degrees (-180 to 180)
photo.clearPictureMetadataCache()
Clears the Photo Sphere Viewer metadata cache. It is useful when current picture or sequence has changed server-side after first load.
Kind: instance method of Photo
photo.setXYZ(x, y, z)
Change the shown position in picture
Kind: instance method of Photo
Param | Type | Description |
---|---|---|
x | number |
X position (in degrees) |
y | number |
Y position (in degrees) |
z | number |
Z position (0-100) |
photo.setHigherContrast(enable)
Enable or disable higher contrast on picture
Kind: instance method of Photo
Param | Type | Description |
---|---|---|
enable | boolean |
True to enable higher contrast |
photo.getTransitionDuration() ⇒ number
Get the duration of stay on a picture during a sequence play.
Kind: instance method of Photo
Returns: number
- The duration (in milliseconds)
photo.setTransitionDuration(value)
Changes the duration of stay on a picture during a sequence play.
Kind: instance method of Photo
Param | Type | Description |
---|---|---|
value | number |
The new duration (in milliseconds, between 100 and 3000) |
photo.showErrorOverlay(e, label, dissmisable)
Display an error message to user on screen
Kind: instance method of Photo
Param | Type | Description |
---|---|---|
e | object |
The initial error |
label | str |
The main error label to display |
dissmisable | boolean |
Is error dissmisable |
photo.playSequence()
Goes continuously to next picture in sequence as long as possible
Kind: instance method of Photo
photo.stopSequence()
Stops playing current sequence
Kind: instance method of Photo
photo.isSequencePlaying() ⇒ boolean
Is there any sequence being played right now ?
Kind: instance method of Photo
Returns: boolean
- True if sequence is playing
photo.toggleSequencePlaying()
Starts/stops the reading of pictures in a sequence
Kind: instance method of Photo
photo.getPicturesNavigation() ⇒ string
Get current pictures navigation mode.
Kind: instance method of Photo
Returns: string
- The picture navigation mode ("any": no restriction, "seq": only pictures in same sequence, "pic": only selected picture)
photo.setPicturesNavigation(pn)
Switch the allowed navigation between pictures.
Kind: instance method of Photo
Param | Type | Description |
---|---|---|
pn | string |
The picture navigation mode ("any": no restriction, "seq": only pictures in same sequence, "pic": only selected picture) |
photo.forceRefresh()
Force reload of texture and tiles.
Kind: instance method of Photo
"ready"
Triggered once when the panorama image has been loaded and the viewer is ready to perform the first render.
Kind: event emitted by Photo
See: Photo Sphere Viewer documentation
"picture-loading"
Event for picture starting to load
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.picId | string |
The picture unique identifier |
detail.lon | number |
Longitude (WGS84) |
detail.lat | number |
Latitude (WGS84) |
detail.x | number |
New x position (in degrees, 0-360), corresponds to heading (0° = North, 90° = East, 180° = South, 270° = West) |
detail.y | number |
New y position (in degrees) |
detail.z | number |
New z position (0-100) |
detail.first | boolean |
True if first picture loaded |
"picture-preview-started"
Event for picture preview
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.picId | string |
The picture ID |
detail.coordinates | Array.<number> |
[x,y] coordinates |
detail.direction | number |
The theorical picture orientation |
"picture-preview-stopped"
Event for end of picture preview
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.picId | string |
The picture ID |
"view-rotated"
Event for viewer rotation
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.x | number |
New x position (in degrees, 0-360), corresponds to heading (0° = North, 90° = East, 180° = South, 270° = West) |
detail.y | number |
New y position (in degrees) |
detail.z | number |
New Z position (between 0 and 100) |
"picture-loaded"
Event for picture load (low-resolution image is loaded)
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.picId | string |
The picture unique identifier |
detail.lon | number |
Longitude (WGS84) |
detail.lat | number |
Latitude (WGS84) |
detail.x | number |
New x position (in degrees, 0-360), corresponds to heading (0° = North, 90° = East, 180° = South, 270° = West) |
detail.y | number |
New y position (in degrees) |
detail.z | number |
New z position (0-100) |
detail.first | boolean |
True if first picture loaded |
"picture-tiles-loaded"
Event launched when all visible tiles of a picture are loaded
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.picId | string |
The picture unique identifier |
"transition-duration-changed"
Event for transition duration change
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.duration | string |
New duration (in milliseconds) |
"sequence-playing"
Event for sequence starting to play
Kind: event emitted by Photo
"sequence-stopped"
Event for sequence stopped playing
Kind: event emitted by Photo
"pictures-navigation-changed"
Event for pictures navigation mode change
Kind: event emitted by Photo
Properties
Name | Type | Description |
---|---|---|
detail.value | string |
New mode (any, pic, seq) |