GeoTwin Documentation
Guide
Applications
Development
Release notes
Guide
Applications
Development
Release notes

PanoramaViewer

A panorama viewer for loading and displaying panoramic images, supporting panorama point switching, view angle control, 3D Viewer linkage, and feature identification.

Class Definition

class PanoramaViewer

Properties

DOM Related

Property Type Description
container HTMLDivElement Outer container DOM element
_container HTMLDivElement Inner container DOM element
canvas HTMLCanvasElement Render canvas
renderer { domElement: HTMLCanvasElement } Renderer containing the render target canvas

Camera

Property Type Description
camera { position: Position3D; rotation: { x, y, z, order }; fov: number; aspect: number } Camera object containing position, rotation, field of view, and aspect ratio
cameraHeading number Camera heading angle (read-only getter)

View Control

Property Type Description
_lng number Horizontal view angle (longitude direction)
_lat number Vertical view angle (latitude direction)
pos Position3D & { fov, heading, pitch } Current position and view angle information (assigned at runtime by render callback)

Coordinates and Binding

Property Type Description
epsg number Coordinate system EPSG code
bindViewer Viewer | undefined Bound 3D Viewer instance (getter/setter, setter accepts null for unbinding)
syncViewer boolean Whether to sync view angle with the bound 3D Viewer (getter/setter)

Panorama Point Markers

Property Type Description
panoMarkerSize number Panorama marker size
panoMarkerColor number (getter) / string (setter) Panorama marker color
_panoMarkerObj { _panoList: Array } Panorama marker internal object

Interaction and Identification

Property Type Description
identifyFeature boolean Whether to enable feature identification

Panorama Switching

Property Type Description
switchDuration number Transition animation duration when switching panoramas
stepSize number Panorama forward step size

Display Settings

Property Type Description
showCompass boolean Whether to show compass
compassLocale LocaleName Compass display language
brightness number Brightness
contrast number Contrast
saturation number Saturation
hue number Hue

Constructor

constructor(containerId: string, options?: PanoViewerOptions)
Parameter Type Required Description
containerId string Yes Container element ID
options PanoViewerOptions No Configuration options

PanoViewerOptions

Property Type Required Description
licensingServiceUrl string No Licensing service URL
bindViewer Viewer No Initially bound 3D Viewer instance
syncViewer boolean No Whether to sync 3D Viewer view angle
panoMarkerSize number No Panorama marker size

Methods

on(eventName, callback)

public on<K extends keyof PanoViewerEventMap>(
    eventName: K,
    callback: PanoViewerEventMap[K]
): void

Registers an event listener. See Events section below for supported event types.

Parameter Type Description
eventName keyof PanoViewerEventMap Event name
callback PanoViewerEventMap[K] Callback function

loadPano(targetPano, nearbyPanoList, config?)

public loadPano(
    targetPano: PanoPoint,
    nearbyPanoList: PanoPoint[],
    config?: { heading?: number; pitch?: number }
): void

Loads a panorama point for the first time.

Parameter Type Required Description
targetPano PanoPoint Yes Target panorama point
nearbyPanoList PanoPoint[] Yes List of nearby panorama points
config { heading?: number; pitch?: number } No Initial view angle configuration

switchPano(targetPano, nearbyPanoList)

public switchPano(targetPano: PanoPoint, nearbyPanoList: PanoPoint[]): void

Switches to another panorama point (use after panorama is loaded).

Parameter Type Description
targetPano PanoPoint Target panorama point
nearbyPanoList PanoPoint[] List of nearby panorama points

getScreenCapture(fileName)

public getScreenCapture(fileName: string): void

Captures the current panorama view and downloads it.

Parameter Type Description
fileName string Download file name

destroy()

public destroy(): void

Destroys the panorama viewer and releases resources.

Events (PanoViewerEventMap)

Listen via on(eventName, callback).

Event Name Callback Signature Description
panoClick (panoId: number) => void Triggered when clicking a panorama point marker, returns the panorama point ID
render (pos: Position3D & { fov, heading, pitch }) => void Triggered on each frame render, returns current position and view angle info
panoLoad () => void Triggered when panorama load is complete
pinpointStart () => void Triggered when pinpoint operation starts
pinpointStop () => void Triggered when pinpoint operation stops
identify (featureInfo: { layerId, featureId, position, attributes }) => void Triggered on feature identification

identify Callback Parameter Details

featureInfo: {
    layerId: number;       // Layer ID
    featureId: number;     // Feature ID
    position: { x: number; y: number; z: number };  // Feature coordinates
    attributes: Record<string, any>;                 // Attribute key-value pairs
}

Related Types

PanoPoint

interface PanoPoint extends BatchPoint {
    folderUrl: string;    // Panorama image folder URL
    panoName: string;     // Panorama point name
    rotationX: number;    // X-axis rotation angle
    rotationY: number;    // Y-axis rotation angle
    rotationZ: number;    // Z-axis rotation angle
}
ON THIS PAGE