Viewer

external class Viewer(val container: Element, options: Viewer.ConstructorOptions? = definedExternally)(source)

A base widget for building applications. It composites all of the standard Cesium widgets into one reusable package. The widget can always be extended by using mixins, which add functionality useful for a variety of applications.

// Initialize the viewer widget with several custom options and mixins.
try {
const viewer = new Viewer("cesiumContainer", {
// Start in Columbus Viewer
sceneMode: SceneMode.COLUMBUS_VIEW,
// Use Cesium World Terrain
terrain: Terrain.fromWorldTerrain(),
// Hide the base layer picker
baseLayerPicker: false,
// Use OpenStreetMaps
baseLayer: new ImageryLayer(new OpenStreetMapImageryProvider({
url: "https://tile.openstreetmap.org/"
})),
skyBox: new SkyBox({
sources: {
positiveX: "stars/TychoSkymapII.t3_08192x04096_80_px.jpg",
negativeX: "stars/TychoSkymapII.t3_08192x04096_80_mx.jpg",
positiveY: "stars/TychoSkymapII.t3_08192x04096_80_py.jpg",
negativeY: "stars/TychoSkymapII.t3_08192x04096_80_my.jpg",
positiveZ: "stars/TychoSkymapII.t3_08192x04096_80_pz.jpg",
negativeZ: "stars/TychoSkymapII.t3_08192x04096_80_mz.jpg"
}
}),
// Show Columbus View map with Web Mercator projection
mapProjection: new WebMercatorProjection()
});
} catch (error) {
console.log(error);
}

// Add basic drag and drop functionality
viewer.extend(viewerDragDropMixin);

// Show a pop-up alert if we encounter an error when processing a dropped file
viewer.dropError.addEventListener(function(dropHandler, name, error) {
console.log(error);
window.alert(error);
});

See also

Constructors

Link copied to clipboard
constructor(container: Element, options: Viewer.ConstructorOptions? = definedExternally)

Types

Link copied to clipboard

Initialization options for the Viewer constructor

Link copied to clipboard
interface FlyToOptions

Properties

Link copied to clipboard

Gets or sets whether or not data sources can temporarily pause animation in order to avoid showing an incomplete picture to the user. For example, if asynchronous primitives are being processed in the background, the clock will not advance until the geometry is ready.

Link copied to clipboard

Gets the Animation widget.

Link copied to clipboard

Gets the BaseLayerPicker.

Link copied to clipboard

Gets the DOM element for the area at the bottom of the window containing the CreditDisplay and potentially other things.

Link copied to clipboard

Gets the camera.

Link copied to clipboard

Gets the canvas.

Link copied to clipboard

Gets the CesiumWidget.

Link copied to clipboard

Gets the clock.

Link copied to clipboard

Gets or sets the data source to track with the viewer's clock.

Link copied to clipboard

Gets the clock view model.

Link copied to clipboard

The DOM element that will contain the widget.

Link copied to clipboard

Manages the list of credits to display on screen and in the lightbox.

Link copied to clipboard

Gets the display used for DataSource visualization.

Link copied to clipboard

Gets the set of DataSource instances to be visualized.

Link copied to clipboard

Gets the default ellipsoid for the scene.

Link copied to clipboard

Gets the collection of entities not tied to a particular data source. This is a shortcut to dataSourceDisplay.defaultDataSource.entities.

Link copied to clipboard

Gets the FullscreenButton.

Link copied to clipboard

Gets the Geocoder.

Link copied to clipboard

Gets the HomeButton.

Link copied to clipboard

Gets the collection of image layers that will be rendered on the globe.

Link copied to clipboard

Gets the info box.

Link copied to clipboard

Gets the NavigationHelpButton.

Link copied to clipboard

Gets the post-process stages.

Link copied to clipboard

Gets the ProjectionPicker.

Link copied to clipboard

Gets or sets a scaling factor for rendering resolution. Values less than 1.0 can improve performance on less powerful devices while values greater than 1.0 will render at a higher resolution and then scale down, resulting in improved visual fidelity. For example, if the widget is laid out at a size of 640x480, setting this value to 0.5 will cause the scene to be rendered at 320x240 and then scaled up while setting it to 2.0 will cause the scene to be rendered at 1280x960 and then scaled down.

Link copied to clipboard

Gets the scene.

Link copied to clipboard

Gets the SceneModePicker.

Link copied to clipboard

Gets the screen space event handler.

Link copied to clipboard

Gets or sets the object instance for which to display a selection indicator.

Link copied to clipboard

Gets the event that is raised when the selected entity changes.

Link copied to clipboard

Gets the selection indicator.

Link copied to clipboard

Get the scene's shadow map

Link copied to clipboard

Determines if shadows are cast by light sources.

Link copied to clipboard

Gets or sets the target frame rate of the widget when useDefaultRenderLoop is true. If undefined, the browser's requestAnimationFrame implementation determines the frame rate. If defined, this value must be greater than 0. A value higher than the underlying requestAnimationFrame implementation will have no effect.

Link copied to clipboard

The terrain provider providing surface geometry for the globe.

Link copied to clipboard

Determines if the terrain casts or shadows from light sources.

Link copied to clipboard

Gets the Timeline widget.

Link copied to clipboard

Gets or sets the Entity instance currently being tracked by the camera.

Link copied to clipboard

Gets the event that is raised when the tracked entity changes.

Link copied to clipboard

Boolean flag indicating if the browser's recommended resolution is used. If true, the browser's device pixel ratio is ignored and 1.0 is used instead, effectively rendering based on CSS pixels instead of device pixels. This can improve performance on less powerful devices that have high pixel density. When false, rendering will be in device pixels. Viewer.resolutionScale will still take effect whether this flag is true or false.

Link copied to clipboard

Gets or sets whether or not this widget should control the render loop. If true the widget will use requestAnimationFrame to perform rendering and resizing of the widget, as well as drive the simulation clock. If set to false, you must manually call the resize, render methods as part of a custom render loop. If an error occurs during rendering, Scene's renderError event will be raised and this property will be set to false. It must be set back to true to continue rendering after the error.

Link copied to clipboard

Gets the VRButton.

Functions

Link copied to clipboard
fun destroy()

Destroys the widget. Should be called if permanently removing the widget from layout.

Link copied to clipboard
fun extend(mixin: ViewerMixin, options: Any? = definedExternally)

Extends the base viewer functionality with the provided mixin. A mixin may add additional properties, functions, or other behavior to the provided viewer instance.

Link copied to clipboard
suspend fun flyTo(target: Cesium3DTileset, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: DataSource, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: EntityCollection, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: ImageryLayer, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: TimeDynamicPointCloud, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<Cesium3DTileset>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<DataSource>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<EntityCollection>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<Entity>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<ImageryLayer>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<TimeDynamicPointCloud>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<VoxelPrimitive>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: Promise<ReadonlyArray<Entity>>, options: Viewer.FlyToOptions? = definedExternally): Boolean
suspend fun flyTo(target: ReadonlyArray<Entity>, options: Viewer.FlyToOptions? = definedExternally): Boolean

suspend fun flyTo(target: Entity, options: Viewer.FlyToOptions? = definedExternally): Boolean

Flies the camera to the provided entity, entities, or data source. If the data source is still in the process of loading or the visualization is otherwise still loading, this method waits for the data to be ready before performing the flight.

Link copied to clipboard
fun flyToAsync(target: Cesium3DTileset, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: DataSource, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Entity, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: EntityCollection, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: ImageryLayer, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: TimeDynamicPointCloud, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<Cesium3DTileset>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<DataSource>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<EntityCollection>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<Entity>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<ImageryLayer>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<TimeDynamicPointCloud>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<VoxelPrimitive>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: Promise<ReadonlyArray<Entity>>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
fun flyToAsync(target: ReadonlyArray<Entity>, options: Viewer.FlyToOptions? = definedExternally): Promise<Boolean>
Link copied to clipboard

This forces the widget to re-think its layout, including widget sizes and credit placement.

Link copied to clipboard
Link copied to clipboard
fun render()

Renders the scene. This function is called automatically unless useDefaultRenderLoop is set to false;

Link copied to clipboard
fun resize()

Resizes the widget to match the container size. This function is called automatically as needed unless useDefaultRenderLoop is set to false.

Link copied to clipboard
suspend fun zoomTo(target: Cesium3DTileset, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: DataSource, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: EntityCollection, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: ImageryLayer, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: TimeDynamicPointCloud, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<Cesium3DTileset>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<DataSource>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<EntityCollection>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<Entity>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<ImageryLayer>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<TimeDynamicPointCloud>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<VoxelPrimitive>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: Promise<ReadonlyArray<Entity>>, offset: HeadingPitchRange? = definedExternally): Boolean
suspend fun zoomTo(target: ReadonlyArray<Entity>, offset: HeadingPitchRange? = definedExternally): Boolean

suspend fun zoomTo(target: Entity, offset: HeadingPitchRange? = definedExternally): Boolean

Asynchronously sets the camera to view the provided entity, entities, or data source. If the data source is still in the process of loading or the visualization is otherwise still loading, this method waits for the data to be ready before performing the zoom.

Link copied to clipboard
fun zoomToAsync(target: Cesium3DTileset, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: DataSource, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Entity, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: EntityCollection, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: ImageryLayer, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: TimeDynamicPointCloud, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<Cesium3DTileset>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<DataSource>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<EntityCollection>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<Entity>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<ImageryLayer>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<TimeDynamicPointCloud>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<VoxelPrimitive>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: Promise<ReadonlyArray<Entity>>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>
fun zoomToAsync(target: ReadonlyArray<Entity>, offset: HeadingPitchRange? = definedExternally): Promise<Boolean>