@cesium/widgets/index.d.ts

A widgets library for use with CesiumJS. CesiumJS is a JavaScript library for creating 3D globes and 2D maps in a web browser without a plugin.

import { BoundingSphere,
Cartesian2,
Cartesian3,
Clock,
ClockRange,
ClockStep,
Color,
Credit,
Ellipsoid,
EllipsoidTerrainProvider,
Event,
Fullscreen,
GeocoderService,
GeographicProjection,
HeadingPitchRange,
Ion,
IonGeocodeProviderType,
JulianDate,
MapProjection,
Plane,
Proxy,
Rectangle,
ReferenceFrame,
Request,
Resource,
ScreenSpaceEventHandler,
TerrainProvider,
Transforms,
WebMercatorProjection,
buildModuleUrl,
defined,
DataSource,
DataSourceClock,
DataSourceCollection,
DataSourceDisplay,
Entity,
EntityCollection,
Atmosphere,
Camera,
Cesium3DTile,
Cesium3DTileColorBlendMode,
Cesium3DTileFeature,
Cesium3DTileset,
ColorBlendMode,
CreditDisplay,
DebugModelMatrixPrimitive,
Globe,
I3SDataProvider,
ImageryLayer,
ImageryLayerCollection,
ImageryProvider,
IonImageryProvider,
Label,
Light,
MapMode2D,
Model,
Moon,
OpenStreetMapImageryProvider,
PostProcessStage,
PostProcessStageCollection,
Primitive,
Scene,
SceneMode,
SceneTransforms,
ShadowMap,
ShadowMode,
SkyAtmosphere,
SkyBox,
Sun,
Terrain,
TileMapServiceImageryProvider,
TimeDynamicPointCloud,
VoxelPrimitive,
CesiumWidget } from "@cesium/engine";
declare module "@cesium/widgets" {
/**
 * Options to control the setting up of a WebGL Context.
 * <p>
 * <code>allowTextureFilterAnisotropic</code> defaults to true, which enables
 * anisotropic texture filtering when the WebGL extension is supported.
 * Setting this to false will improve performance, but hurt visual quality,
 * especially for horizon views.
 * </p>
 * @property [requestWebgl1 = false] - If true and the browser supports it, use a WebGL 1 rendering context
 * @property [allowTextureFilterAnisotropic = true] - If true, use anisotropic filtering during texture sampling
 * @property [webgl] - WebGL options to be passed on to canvas.getContext
 * @property [getWebGLStub] - A function to create a WebGL stub for testing
 */
export type ContextOptions = {
    requestWebgl1?: boolean;
    allowTextureFilterAnisotropic?: boolean;
    webgl?: WebGLOptions;
    getWebGLStub?: (...params: any[]) => any;
};

/**
 * WebGL options to be passed on to HTMLCanvasElement.getContext().
 * See {@link https://registry.khronos.org/webgl/specs/latest/1.0/#5.2|WebGLContextAttributes}
 * but note the modified defaults for 'alpha', 'stencil', and 'powerPreference'
 *
 * <p>
 * <code>alpha</code> defaults to false, which can improve performance
 * compared to the standard WebGL default of true.  If an application needs
 * to composite Cesium above other HTML elements using alpha-blending, set
 * <code>alpha</code> to true.
 * </p>
 */
export type WebGLOptions = {
    alpha?: boolean;
    depth?: boolean;
    stencil?: boolean;
    antialias?: boolean;
    premultipliedAlpha?: boolean;
    preserveDrawingBuffer?: boolean;
    powerPreference?: "default" | "low-power" | "high-performance";
    failIfMajorPerformanceCaveat?: boolean;
};

/**
 * <span style="display: block; text-align: center;">
 * <img src="Images/AnimationWidget.png" width="211" height="142" alt="" />
 * <br />Animation widget
 * </span>
 * <br /><br />
 * The Animation widget provides buttons for play, pause, and reverse, along with the
 * current time and date, surrounded by a "shuttle ring" for controlling the speed of animation.
 * <br /><br />
 * The "shuttle ring" concept is borrowed from video editing, where typically a
 * "jog wheel" can be rotated to move past individual animation frames very slowly, and
 * a surrounding shuttle ring can be twisted to control direction and speed of fast playback.
 * Cesium typically treats time as continuous (not broken into pre-defined animation frames),
 * so this widget offers no jog wheel.  Instead, the shuttle ring is capable of both fast and
 * very slow playback.  Click and drag the shuttle ring pointer itself (shown above in green),
 * or click in the rest of the ring area to nudge the pointer to the next preset speed in that direction.
 * <br /><br />
 * The Animation widget also provides a "realtime" button (in the upper-left) that keeps
 * animation time in sync with the end user's system clock, typically displaying
 * "today" or "right now."  This mode is not available in {@link ClockRange.CLAMPED} or
 * {@link ClockRange.LOOP_STOP} mode if the current time is outside of {@link Clock}'s startTime and endTime.
 * @example
 * // In HTML head, include a link to Animation.css stylesheet,
 * // and in the body, include: <div id="animationContainer"></div>
 *
 * const clock = new Cesium.Clock();
 * const clockViewModel = new Cesium.ClockViewModel(clock);
 * const viewModel = new Cesium.AnimationViewModel(clockViewModel);
 * const widget = new Cesium.Animation('animationContainer', viewModel);
 *
 * function tick() {
 *     clock.tick();
 *     requestAnimationFrame(tick);
 * }
 * requestAnimationFrame(tick);
 * @param container - The DOM element or ID that will contain the widget.
 * @param viewModel - The view model used by this widget.
 */
export class Animation {
    constructor(container: Element | string, viewModel: AnimationViewModel);
    /**
     * Gets the parent container.
     */
    readonly container: Element;
    /**
     * Gets the view model.
     */
    readonly viewModel: AnimationViewModel;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the animation widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
    /**
     * Resizes the widget to match the container size.
     * This function should be called whenever the container size is changed.
     */
    resize(): void;
    /**
     * Updates the widget to reflect any modified CSS rules for theming.
     * @example
     * //Switch to the cesium-lighter theme.
     * document.body.className = 'cesium-lighter';
     * animation.applyThemeChanges();
     */
    applyThemeChanges(): void;
}

/**
 * The view model for the {@link Animation} widget.
 * @param clockViewModel - The ClockViewModel instance to use.
 */
export class AnimationViewModel {
    constructor(clockViewModel: ClockViewModel);
    /**
     * Gets or sets whether the shuttle ring is currently being dragged.  This property is observable.
     */
    shuttleRingDragging: boolean;
    /**
     * Gets or sets whether dragging the shuttle ring should cause the multiplier
     * to snap to the defined tick values rather than interpolating between them.
     * This property is observable.
     */
    snapToTicks: boolean;
    /**
     * Gets the string representation of the current time.  This property is observable.
     */
    timeLabel: string;
    /**
     * Gets the string representation of the current date.  This property is observable.
     */
    dateLabel: string;
    /**
     * Gets the string representation of the current multiplier.  This property is observable.
     */
    multiplierLabel: string;
    /**
     * Gets or sets the current shuttle ring angle.  This property is observable.
     */
    shuttleRingAngle: number;
    /**
     * Gets or sets the default date formatter used by new instances.
     */
    static defaultDateFormatter: AnimationViewModel.DateFormatter;
    /**
     * Gets or sets the default array of known clock multipliers associated with new instances of the shuttle ring.
     */
    static defaultTicks: number[];
    /**
     * Gets or sets the default time formatter used by new instances.
     */
    static defaultTimeFormatter: AnimationViewModel.TimeFormatter;
    /**
     * Gets a copy of the array of positive known clock multipliers to associate with the shuttle ring.
     * @returns The array of known clock multipliers associated with the shuttle ring.
     */
    getShuttleRingTicks(): number[];
    /**
     * Sets the array of positive known clock multipliers to associate with the shuttle ring.
     * These values will have negative equivalents created for them and sets both the minimum
     * and maximum range of values for the shuttle ring as well as the values that are snapped
     * to when a single click is made.  The values need not be in order, as they will be sorted
     * automatically, and duplicate values will be removed.
     * @param positiveTicks - The list of known positive clock multipliers to associate with the shuttle ring.
     */
    setShuttleRingTicks(positiveTicks: number[]): void;
    /**
     * Gets a command that decreases the speed of animation.
     */
    slower: Command;
    /**
     * Gets a command that increases the speed of animation.
     */
    faster: Command;
    /**
     * Gets the clock view model.
     */
    clockViewModel: ClockViewModel;
    /**
     * Gets the pause toggle button view model.
     */
    pauseViewModel: ToggleButtonViewModel;
    /**
     * Gets the reverse toggle button view model.
     */
    playReverseViewModel: ToggleButtonViewModel;
    /**
     * Gets the play toggle button view model.
     */
    playForwardViewModel: ToggleButtonViewModel;
    /**
     * Gets the realtime toggle button view model.
     */
    playRealtimeViewModel: ToggleButtonViewModel;
    /**
     * Gets or sets the function which formats a date for display.
     */
    dateFormatter: AnimationViewModel.DateFormatter;
    /**
     * Gets or sets the function which formats a time for display.
     */
    timeFormatter: AnimationViewModel.TimeFormatter;
}

export namespace AnimationViewModel {
    /**
     * A function that formats a date for display.
     * @param date - The date to be formatted
     * @param viewModel - The AnimationViewModel instance requesting formatting.
     */
    type DateFormatter = (date: JulianDate, viewModel: AnimationViewModel) => string;
    /**
     * A function that formats a time for display.
     * @param date - The date to be formatted
     * @param viewModel - The AnimationViewModel instance requesting formatting.
     */
    type TimeFormatter = (date: JulianDate, viewModel: AnimationViewModel) => string;
}

/**
 * <span style="display: block; text-align: center;">
 * <img src="Images/BaseLayerPicker.png" width="264" alt="BaseLayerPicker" />
 * <br />BaseLayerPicker with its drop-panel open.
 * </span>
 * <br /><br />
 * The BaseLayerPicker is a single button widget that displays a panel of available imagery and
 * terrain providers.  When imagery is selected, the corresponding imagery layer is created and inserted
 * as the base layer of the imagery collection; removing the existing base.  When terrain is selected,
 * it replaces the current terrain provider.  Each item in the available providers list contains a name,
 * a representative icon, and a tooltip to display more information when hovered. The list is initially
 * empty, and must be configured before use, as illustrated in the below example.
 * <br /><br />
 * By default, the BaseLayerPicker uses a default list of example providers for demonstration purposes.
 * Notably some of these providers, such as <a href="https://developers.arcgis.com" target="_blank">Esri ArcGIS</a> and <a href="https://docs.stadiamaps.com/ target="_blank">Stadia Maps</a>, have seperate terms of service and require authentication for production use.
 * @example
 * // In HTML head, include a link to the BaseLayerPicker.css stylesheet,
 * // and in the body, include: <div id="baseLayerPickerContainer"
 * //   style="position:absolute;top:24px;right:24px;width:38px;height:38px;"></div>
 *
 * //Create the list of available providers we would like the user to select from.
 * //This example uses 3, OpenStreetMap, The Black Marble, and a single, non-streaming world image.
 * const imageryViewModels = [];
 * imageryViewModels.push(new Cesium.ProviderViewModel({
 *      name: "Open\u00adStreet\u00adMap",
 *      iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/openStreetMap.png"),
 *      tooltip: "OpenStreetMap (OSM) is a collaborative project to create a free editable \
 * map of the world.\nhttp://www.openstreetmap.org",
 *      creationFunction: function() {
 *          return new Cesium.OpenStreetMapImageryProvider({
 *              url: "https://tile.openstreetmap.org/"
 *          });
 *      }
 *  }));
 *
 *  imageryViewModels.push(new Cesium.ProviderViewModel({
 *      name: "Earth at Night",
 *      iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/blackMarble.png"),
 *      tooltip: "The lights of cities and villages trace the outlines of civilization \
 * in this global view of the Earth at night as seen by NASA/NOAA's Suomi NPP satellite.",
 *      creationFunction: function() {
 *          return Cesium.IonImageryProvider.fromAssetId(3812);
 *      }
 *  }));
 *
 *  imageryViewModels.push(new Cesium.ProviderViewModel({
 *      name: "Natural Earth\u00a0II",
 *      iconUrl: Cesium.buildModuleUrl("Widgets/Images/ImageryProviders/naturalEarthII.png"),
 *      tooltip: "Natural Earth II, darkened for contrast.\nhttp://www.naturalearthdata.com/",
 *      creationFunction: function() {
 *          return Cesium.TileMapServiceImageryProvider.fromUrl(
 *              Cesium.buildModuleUrl("Assets/Textures/NaturalEarthII")
 *          );
 *      }
 *  }));
 *
 * //Create a CesiumWidget without imagery, if you haven't already done so.
 * const cesiumWidget = new Cesium.CesiumWidget("cesiumContainer", { baseLayer: false });
 *
 * //Finally, create the baseLayerPicker widget using our view models.
 * const layers = cesiumWidget.imageryLayers;
 * const baseLayerPicker = new Cesium.BaseLayerPicker("baseLayerPickerContainer", {
 *     globe: cesiumWidget.scene.globe,
 *     imageryProviderViewModels: imageryViewModels
 * });
 * @param container - The parent HTML container node or ID for this widget.
 * @param options - Object with the following properties:
 * @param options.globe - The Globe to use.
 * @param [options.imageryProviderViewModels = []] - The array of ProviderViewModel instances to use for imagery.
 * @param [options.selectedImageryProviderViewModel] - The view model for the current base imagery layer, if not supplied the first available imagery layer is used.
 * @param [options.terrainProviderViewModels = []] - The array of ProviderViewModel instances to use for terrain.
 * @param [options.selectedTerrainProviderViewModel] - The view model for the current base terrain layer, if not supplied the first available terrain layer is used.
 */
export class BaseLayerPicker {
    constructor(container: Element | string, options: {
        globe: Globe;
        imageryProviderViewModels?: ProviderViewModel[];
        selectedImageryProviderViewModel?: ProviderViewModel;
        terrainProviderViewModels?: ProviderViewModel[];
        selectedTerrainProviderViewModel?: ProviderViewModel;
    });
    /**
     * Gets the parent container.
     */
    container: Element;
    /**
     * Gets the view model.
     */
    viewModel: BaseLayerPickerViewModel;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * The view model for {@link BaseLayerPicker}.
 * @param options - Object with the following properties:
 * @param options.globe - The Globe to use.
 * @param [options.imageryProviderViewModels = []] - The array of ProviderViewModel instances to use for imagery.
 * @param [options.selectedImageryProviderViewModel] - The view model for the current base imagery layer, if not supplied the first available imagery layer is used.
 * @param [options.terrainProviderViewModels = []] - The array of ProviderViewModel instances to use for terrain.
 * @param [options.selectedTerrainProviderViewModel] - The view model for the current base terrain layer, if not supplied the first available terrain layer is used.
 */
export class BaseLayerPickerViewModel {
    constructor(options: {
        globe: Globe;
        imageryProviderViewModels?: ProviderViewModel[];
        selectedImageryProviderViewModel?: ProviderViewModel;
        terrainProviderViewModels?: ProviderViewModel[];
        selectedTerrainProviderViewModel?: ProviderViewModel;
    });
    /**
     * Gets or sets an array of ProviderViewModel instances available for imagery selection.
     * This property is observable.
     */
    imageryProviderViewModels: ProviderViewModel[];
    /**
     * Gets or sets an array of ProviderViewModel instances available for terrain selection.
     * This property is observable.
     */
    terrainProviderViewModels: ProviderViewModel[];
    /**
     * Gets or sets whether the imagery selection drop-down is currently visible.
     */
    dropDownVisible: boolean;
    /**
     * Gets the button tooltip.  This property is observable.
     */
    buttonTooltip: string;
    /**
     * Gets the button background image.  This property is observable.
     */
    buttonImageUrl: string;
    /**
     * Gets or sets the currently selected imagery.  This property is observable.
     */
    selectedImagery: ProviderViewModel;
    /**
     * Gets or sets the currently selected terrain.  This property is observable.
     */
    selectedTerrain: ProviderViewModel;
    /**
     * Gets the command to toggle the visibility of the drop down.
     */
    toggleDropDown: Command;
    /**
     * Gets the globe.
     */
    globe: Globe;
}

/**
 * A view model that represents each item in the {@link BaseLayerPicker}.
 * @param options - The object containing all parameters.
 * @param options.name - The name of the layer.
 * @param options.tooltip - The tooltip to show when the item is moused over.
 * @param options.iconUrl - An icon representing the layer.
 * @param [options.category] - A category for the layer.
 * @param options.creationFunction - A function or Command
 *        that creates one or more providers which will be added to the globe when this item is selected.
 */
export class ProviderViewModel {
    constructor(options: {
        name: string;
        tooltip: string;
        iconUrl: string;
        category?: string;
        creationFunction: ProviderViewModel.CreationFunction | Command;
    });
    /**
     * Gets the display name.  This property is observable.
     */
    name: string;
    /**
     * Gets the tooltip.  This property is observable.
     */
    tooltip: string;
    /**
     * Gets the icon.  This property is observable.
     */
    iconUrl: string;
    /**
     * Gets the Command that creates one or more providers which will be added to
     * the globe when this item is selected.
     */
    readonly creationCommand: Command;
    /**
     * Gets the category
     */
    readonly category: string;
}

export namespace ProviderViewModel {
    /**
     * A function which creates one or more providers.
     */
    type CreationFunction = () => ImageryProvider | TerrainProvider | ImageryProvider[] | TerrainProvider[] | Promise<TerrainProvider> | Promise<ImageryProvider> | Promise<TerrainProvider[]> | Promise<ImageryProvider[]>;
}

/**
 * Inspector widget to aid in debugging 3D Tiles
 * @param container - The DOM element or ID that will contain the widget.
 * @param scene - the Scene instance to use.
 */
export class Cesium3DTilesInspector {
    constructor(container: Element | string, scene: Scene);
    /**
     * Gets the parent container.
     */
    container: Element;
    /**
     * Gets the view model.
     */
    viewModel: Cesium3DTilesInspectorViewModel;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * The view model for {@link Cesium3DTilesInspector}.
 * @param scene - The scene instance to use.
 * @param performanceContainer - The container for the performance display
 */
export class Cesium3DTilesInspectorViewModel {
    constructor(scene: Scene, performanceContainer: HTMLElement);
    /**
     * Gets or sets the flag to enable performance display.  This property is observable.
     */
    performance: boolean;
    /**
     * Gets or sets the flag to show statistics.  This property is observable.
     */
    showStatistics: boolean;
    /**
     * Gets or sets the flag to show pick statistics.  This property is observable.
     */
    showPickStatistics: boolean;
    /**
     * Gets or sets the flag to show resource cache statistics. This property is
     * observable.
     */
    showResourceCacheStatistics: boolean;
    /**
     * Gets or sets the flag to show the inspector.  This property is observable.
     */
    inspectorVisible: boolean;
    /**
     * Gets or sets the flag to show the tileset section.  This property is observable.
     */
    tilesetVisible: boolean;
    /**
     * Gets or sets the flag to show the display section.  This property is observable.
     */
    displayVisible: boolean;
    /**
     * Gets or sets the flag to show the update section.  This property is observable.
     */
    updateVisible: boolean;
    /**
     * Gets or sets the flag to show the logging section.  This property is observable.
     */
    loggingVisible: boolean;
    /**
     * Gets or sets the flag to show the style section.  This property is observable.
     */
    styleVisible: boolean;
    /**
     * Gets or sets the flag to show the tile info section.  This property is observable.
     */
    tileDebugLabelsVisible: boolean;
    /**
     * Gets or sets the flag to show the optimization info section. This property is observable.
     */
    optimizationVisible: boolean;
    /**
     * Gets or sets the JSON for the tileset style.  This property is observable.
     */
    styleString: string;
    /**
     * Gets or sets the JSON for the tileset enableDebugWireframe attribute.  This property is observable.
     */
    hasEnabledWireframe: boolean;
    /**
     * Gets the names of the properties in the tileset.  This property is observable.
     */
    readonly properties: string[];
    /**
     * Gets or sets the flag to enable dynamic screen space error.  This property is observable.
     */
    dynamicScreenSpaceError: boolean;
    /**
     * Gets or sets the color blend mode.  This property is observable.
     */
    colorBlendMode: Cesium3DTileColorBlendMode;
    /**
     * Gets or sets the flag to enable picking.  This property is observable.
     */
    picking: boolean;
    /**
     * Gets or sets the flag to colorize tiles.  This property is observable.
     */
    colorize: boolean;
    /**
     * Gets or sets the flag to draw with wireframe.  This property is observable.
     */
    wireframe: boolean;
    /**
     * Gets or sets the flag to show bounding volumes.  This property is observable.
     */
    showBoundingVolumes: boolean;
    /**
     * Gets or sets the flag to show content volumes.  This property is observable.
     */
    showContentBoundingVolumes: boolean;
    /**
     * Gets or sets the flag to show request volumes.  This property is observable.
     */
    showRequestVolumes: boolean;
    /**
     * Gets or sets the flag to suspend updates.  This property is observable.
     */
    freezeFrame: boolean;
    /**
     * Gets or sets the flag to show debug labels only for the currently picked tile.  This property is observable.
     */
    showOnlyPickedTileDebugLabel: boolean;
    /**
     * Gets or sets the flag to show tile geometric error.  This property is observable.
     */
    showGeometricError: boolean;
    /**
     * Displays the number of commands, points, triangles and features used per tile.  This property is observable.
     */
    showRenderingStatistics: boolean;
    /**
     * Displays the memory used per tile.  This property is observable.
     */
    showMemoryUsage: boolean;
    /**
     * Gets or sets the flag to show the tile url.  This property is observable.
     */
    showUrl: boolean;
    /**
     * Gets or sets the maximum screen space error.  This property is observable.
     */
    maximumScreenSpaceError: number;
    /**
     * Gets or sets the dynamic screen space error density.  This property is observable.
     */
    dynamicScreenSpaceErrorDensity: number;
    /**
     * Gets or sets the dynamic screen space error density slider value.
     * This allows the slider to be exponential because values tend to be closer to 0 than 1.
     * This property is observable.
     */
    dynamicScreenSpaceErrorDensitySliderValue: number;
    /**
     * Gets or sets the dynamic screen space error factor.  This property is observable.
     */
    dynamicScreenSpaceErrorFactor: number;
    /**
     * Gets or sets the flag to enable point cloud shading. This property is observable.
     */
    pointCloudShading: boolean;
    /**
     * Gets or sets the geometric error scale.  This property is observable.
     */
    geometricErrorScale: number;
    /**
     * Gets or sets the maximum attenuation.  This property is observable.
     */
    maximumAttenuation: number;
    /**
     * Gets or sets the base resolution.  This property is observable.
     */
    baseResolution: number;
    /**
     * Gets or sets the flag to enable eye dome lighting. This property is observable.
     */
    eyeDomeLighting: boolean;
    /**
     * Gets or sets the eye dome lighting strength.  This property is observable.
     */
    eyeDomeLightingStrength: number;
    /**
     * Gets or sets the eye dome lighting radius.  This property is observable.
     */
    eyeDomeLightingRadius: number;
    /**
     * Gets or sets the pick state
     */
    pickActive: boolean;
    /**
     * Gets or sets the flag to determine if level of detail skipping should be applied during the traversal.
     * This property is observable.
     */
    skipLevelOfDetail: boolean;
    /**
     * Gets or sets the multiplier defining the minimum screen space error to skip. This property is observable.
     */
    skipScreenSpaceErrorFactor: number;
    /**
     * Gets or sets the screen space error that must be reached before skipping levels of detail. This property is observable.
     */
    baseScreenSpaceError: number;
    /**
     * Gets or sets the constant defining the minimum number of levels to skip when loading tiles. This property is observable.
     */
    skipLevels: number;
    /**
     * Gets or sets the flag which, when true, only tiles that meet the maximum screen space error will ever be downloaded.
     * This property is observable.
     */
    immediatelyLoadDesiredLevelOfDetail: boolean;
    /**
     * Gets or sets the flag which determines whether siblings of visible tiles are always downloaded during traversal.
     * This property is observable
     */
    loadSiblings: boolean;
    /**
     * Gets the scene
     */
    readonly scene: Scene;
    /**
     * Gets the performance container
     */
    readonly performanceContainer: HTMLElement;
    /**
     * Gets the statistics text.  This property is observable.
     */
    readonly statisticsText: string;
    /**
     * Gets the pick statistics text.  This property is observable.
     */
    readonly pickStatisticsText: string;
    /**
     * Gets the resource cache statistics text. This property is observable.
     */
    readonly resourceCacheStatisticsText: string;
    /**
     * Gets the available blend modes
     */
    readonly colorBlendModes: object[];
    /**
     * Gets the editor error message
     */
    readonly editorError: string;
    /**
     * Gets or sets the tileset of the view model.
     */
    tileset: Cesium3DTileset;
    /**
     * Gets the current feature of the view model.
     */
    feature: Cesium3DTileFeature;
    /**
     * Gets the current tile of the view model
     */
    tile: Cesium3DTile;
    /**
     * Toggles the pick tileset mode
     */
    togglePickTileset(): void;
    /**
     * Toggles the inspector visibility
     */
    toggleInspector(): void;
    /**
     * Toggles the visibility of the tileset section
     */
    toggleTileset(): void;
    /**
     * Toggles the visibility of the display section
     */
    toggleDisplay(): void;
    /**
     * Toggles the visibility of the update section
     */
    toggleUpdate(): void;
    /**
     * Toggles the visibility of the logging section
     */
    toggleLogging(): void;
    /**
     * Toggles the visibility of the style section
     */
    toggleStyle(): void;
    /**
     * Toggles the visibility of the tile Debug Info section
     */
    toggleTileDebugLabels(): void;
    /**
     * Toggles the visibility of the optimization section
     */
    toggleOptimization(): void;
    /**
     * Trims tile cache
     */
    trimTilesCache(): void;
    /**
     * Compiles the style in the style editor.
     */
    compileStyle(): void;
    /**
     * Handles key press events on the style editor.
     */
    styleEditorKeyPress(): void;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
    /**
     * Generates an HTML string of the statistics
     * @param tileset - The tileset
     * @param isPick - Whether this is getting the statistics for the pick pass
     * @returns The formatted statistics
     */
    static getStatistics(tileset: Cesium3DTileset, isPick: boolean): string;
}

/**
 * Inspector widget to aid in debugging
 * @param container - The DOM element or ID that will contain the widget.
 * @param scene - The Scene instance to use.
 */
export class CesiumInspector {
    constructor(container: Element | string, scene: Scene);
    /**
     * Gets the parent container.
     */
    container: Element;
    /**
     * Gets the view model.
     */
    viewModel: CesiumInspectorViewModel;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * The view model for {@link CesiumInspector}.
 * @param scene - The scene instance to use.
 * @param performanceContainer - The instance to use for performance container.
 */
export class CesiumInspectorViewModel {
    constructor(scene: Scene, performanceContainer: Element);
    /**
     * Gets or sets the show frustums state.  This property is observable.
     */
    frustums: boolean;
    /**
     * Gets or sets the show frustum planes state.  This property is observable.
     */
    frustumPlanes: boolean;
    /**
     * Gets or sets the show performance display state.  This property is observable.
     */
    performance: boolean;
    /**
     * Gets or sets the shader cache text.  This property is observable.
     */
    shaderCacheText: string;
    /**
     * Gets or sets the show primitive bounding sphere state.  This property is observable.
     */
    primitiveBoundingSphere: boolean;
    /**
     * Gets or sets the show primitive reference frame state.  This property is observable.
     */
    primitiveReferenceFrame: boolean;
    /**
     * Gets or sets the filter primitive state.  This property is observable.
     */
    filterPrimitive: boolean;
    /**
     * Gets or sets the show tile bounding sphere state.  This property is observable.
     */
    tileBoundingSphere: boolean;
    /**
     * Gets or sets the filter tile state.  This property is observable.
     */
    filterTile: boolean;
    /**
     * Gets or sets the show wireframe state.  This property is observable.
     */
    wireframe: boolean;
    /**
     * Gets or sets the index of the depth frustum to display.  This property is observable.
     */
    depthFrustum: number;
    /**
     * Gets or sets the suspend updates state.  This property is observable.
     */
    suspendUpdates: boolean;
    /**
     * Gets or sets the show tile coordinates state.  This property is observable.
     */
    tileCoordinates: boolean;
    /**
     * Gets or sets the frustum statistic text.  This property is observable.
     */
    frustumStatisticText: string;
    /**
     * Gets or sets the selected tile information text.  This property is observable.
     */
    tileText: string;
    /**
     * Gets if a primitive has been selected.  This property is observable.
     */
    hasPickedPrimitive: boolean;
    /**
     * Gets if a tile has been selected.  This property is observable
     */
    hasPickedTile: boolean;
    /**
     * Gets if the picking primitive command is active.  This property is observable.
     */
    pickPrimitiveActive: boolean;
    /**
     * Gets if the picking tile command is active.  This property is observable.
     */
    pickTileActive: boolean;
    /**
     * Gets or sets if the cesium inspector drop down is visible.  This property is observable.
     */
    dropDownVisible: boolean;
    /**
     * Gets or sets if the general section is visible.  This property is observable.
     */
    generalVisible: boolean;
    /**
     * Gets or sets if the primitive section is visible.  This property is observable.
     */
    primitivesVisible: boolean;
    /**
     * Gets or sets if the terrain section is visible.  This property is observable.
     */
    terrainVisible: boolean;
    /**
     * Gets or sets the index of the depth frustum text.  This property is observable.
     */
    depthFrustumText: string;
    /**
     * Gets the scene to control.
     */
    scene: Scene;
    /**
     * Gets the container of the PerformanceDisplay
     */
    performanceContainer: Element;
    /**
     * Gets the command to toggle the visibility of the drop down.
     */
    toggleDropDown: Command;
    /**
     * Gets the command to toggle the visibility of a BoundingSphere for a primitive
     */
    showPrimitiveBoundingSphere: Command;
    /**
     * Gets the command to toggle the visibility of a {@link DebugModelMatrixPrimitive} for the model matrix of a primitive
     */
    showPrimitiveReferenceFrame: Command;
    /**
     * Gets the command to toggle a filter that renders only a selected primitive
     */
    doFilterPrimitive: Command;
    /**
     * Gets the command to increment the depth frustum index to be shown
     */
    incrementDepthFrustum: Command;
    /**
     * Gets the command to decrement the depth frustum index to be shown
     */
    decrementDepthFrustum: Command;
    /**
     * Gets the command to toggle the visibility of tile coordinates
     */
    showTileCoordinates: Command;
    /**
     * Gets the command to toggle the visibility of a BoundingSphere for a selected tile
     */
    showTileBoundingSphere: Command;
    /**
     * Gets the command to toggle a filter that renders only a selected tile
     */
    doFilterTile: Command;
    /**
     * Gets the command to expand and collapse the general section
     */
    toggleGeneral: Command;
    /**
     * Gets the command to expand and collapse the primitives section
     */
    togglePrimitives: Command;
    /**
     * Gets the command to expand and collapse the terrain section
     */
    toggleTerrain: Command;
    /**
     * Gets the command to pick a primitive
     */
    pickPrimitive: Command;
    /**
     * Gets the command to pick a tile
     */
    pickTile: Command;
    /**
     * Gets the command to pick a tile
     */
    selectParent: Command;
    /**
     * Gets the command to pick a tile
     */
    selectNW: Command;
    /**
     * Gets the command to pick a tile
     */
    selectNE: Command;
    /**
     * Gets the command to pick a tile
     */
    selectSW: Command;
    /**
     * Gets the command to pick a tile
     */
    selectSE: Command;
    /**
     * Gets or sets the current selected primitive
     */
    primitive: Command;
    /**
     * Gets or sets the current selected tile
     */
    tile: Command;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * A view model which exposes a {@link Clock} for user interfaces.
 * @param [clock] - The clock object wrapped by this view model, if undefined a new instance will be created.
 */
export class ClockViewModel {
    constructor(clock?: Clock);
    /**
     * Gets the current system time.
     * This property is observable.
     */
    systemTime: JulianDate;
    /**
     * Gets or sets the start time of the clock.
     * See {@link Clock#startTime}.
     * This property is observable.
     */
    startTime: JulianDate;
    /**
     * Gets or sets the stop time of the clock.
     * See {@link Clock#stopTime}.
     * This property is observable.
     */
    stopTime: JulianDate;
    /**
     * Gets or sets the current time.
     * See {@link Clock#currentTime}.
     * This property is observable.
     */
    currentTime: JulianDate;
    /**
     * Gets or sets the clock multiplier.
     * See {@link Clock#multiplier}.
     * This property is observable.
     */
    multiplier: number;
    /**
     * Gets or sets the clock step setting.
     * See {@link Clock#clockStep}.
     * This property is observable.
     */
    clockStep: ClockStep;
    /**
     * Gets or sets the clock range setting.
     * See {@link Clock#clockRange}.
     * This property is observable.
     */
    clockRange: ClockRange;
    /**
     * Gets or sets whether the clock can animate.
     * See {@link Clock#canAnimate}.
     * This property is observable.
     */
    canAnimate: boolean;
    /**
     * Gets or sets whether the clock should animate.
     * See {@link Clock#shouldAnimate}.
     * This property is observable.
     */
    shouldAnimate: boolean;
    /**
     * Gets the underlying Clock.
     */
    clock: Clock;
    /**
     * Updates the view model with the contents of the underlying clock.
     * Can be called to force an update of the viewModel if the underlying
     * clock has changed and <code>Clock.tick</code> has not yet been called.
     */
    synchronize(): void;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the view model.  Should be called to
     * properly clean up the view model when it is no longer needed.
     */
    destroy(): void;
}

/**
 * A Command is a function with an extra <code>canExecute</code> observable property to determine
 * whether the command can be executed.  When executed, a Command function will check the
 * value of <code>canExecute</code> and throw if false.
 *
 * This type describes an interface and is not intended to be instantiated directly.
 * See {@link createCommand} to create a command from a function.
 */
export class Command {
    constructor();
    /**
     * Gets whether this command can currently be executed.  This property is observable.
     */
    canExecute: boolean;
    /**
     * Gets an event which is raised before the command executes, the event
     * is raised with an object containing two properties: a <code>cancel</code> property,
     * which if set to false by the listener will prevent the command from being executed, and
     * an <code>args</code> property, which is the array of arguments being passed to the command.
     */
    beforeExecute: Event;
    /**
     * Gets an event which is raised after the command executes, the event
     * is raised with the return value of the command as its only parameter.
     */
    afterExecute: Event;
}

/**
 * A single button widget for toggling fullscreen mode.
 * @param container - The DOM element or ID that will contain the widget.
 * @param [fullscreenElement = document.body] - The element or id to be placed into fullscreen mode.
 */
export class FullscreenButton {
    constructor(container: Element | string, fullscreenElement?: Element | string);
    /**
     * Gets the parent container.
     */
    container: Element;
    /**
     * Gets the view model.
     */
    viewModel: FullscreenButtonViewModel;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * The view model for {@link FullscreenButton}.
 * @param [fullscreenElement = document.body] - The element or id to be placed into fullscreen mode.
 * @param [container] - The DOM element or ID that will contain the widget.
 */
export class FullscreenButtonViewModel {
    constructor(fullscreenElement?: Element | string, container?: Element | string);
    /**
     * Gets whether or not fullscreen mode is active.  This property is observable.
     */
    isFullscreen: boolean;
    /**
     * Gets or sets whether or not fullscreen functionality should be enabled.  This property is observable.
     */
    isFullscreenEnabled: boolean;
    /**
     * Gets the tooltip.  This property is observable.
     */
    tooltip: string;
    /**
     * Gets or sets the HTML element to place into fullscreen mode when the
     * corresponding button is pressed.
     */
    fullscreenElement: Element;
    /**
     * Gets the Command to toggle fullscreen mode.
     */
    command: Command;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the view model.  Should be called to
     * properly clean up the view model when it is no longer needed.
     */
    destroy(): void;
}

/**
 * A widget for finding addresses and landmarks, and flying the camera to them.  Geocoding is
 * performed using {@link https://cesium.com/cesium-ion/|Cesium ion}.
 * @param options - Object with the following properties:
 * @param options.container - The DOM element or ID that will contain the widget.
 * @param options.scene - The Scene instance to use.
 * @param [options.geocoderServices] - The geocoder services to be used
 * @param [options.autoComplete = true] - True if the geocoder should query as the user types to autocomplete
 * @param [options.flightDuration = 1.5] - The duration of the camera flight to an entered location, in seconds.
 * @param [options.destinationFound = GeocoderViewModel.flyToDestination] - A callback function that is called after a successful geocode.  If not supplied, the default behavior is to fly the camera to the result destination.
 */
export class Geocoder {
    constructor(options: {
        container: Element | string;
        scene: Scene;
        geocoderServices?: GeocoderService[];
        autoComplete?: boolean;
        flightDuration?: number;
        destinationFound?: Geocoder.DestinationFoundFunction;
    });
    /**
     * Gets the parent container.
     */
    container: Element;
    /**
     * Gets the parent container.
     */
    searchSuggestionsContainer: Element;
    /**
     * Gets the view model.
     */
    viewModel: GeocoderViewModel;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

export namespace Geocoder {
    /**
     * A function that handles the result of a successful geocode.
     * @param viewModel - The view model.
     * @param destination - The destination result of the geocode.
     */
    type DestinationFoundFunction = (viewModel: GeocoderViewModel, destination: Cartesian3 | Rectangle) => void;
}

/**
 * The view model for the {@link Geocoder} widget.
 * @param options - Object with the following properties:
 * @param options.scene - The Scene instance to use.
 * @param [options.geocoderServices] - Geocoder services to use for geocoding queries.
 *        If more than one are supplied, suggestions will be gathered for the geocoders that support it,
 *        and if no suggestion is selected the result from the first geocoder service wil be used.
 * @param [options.flightDuration] - The duration of the camera flight to an entered location, in seconds.
 * @param [options.destinationFound = GeocoderViewModel.flyToDestination] - A callback function that is called after a successful geocode.  If not supplied, the default behavior is to fly the camera to the result destination.
 */
export class GeocoderViewModel {
    constructor(options: {
        scene: Scene;
        geocoderServices?: GeocoderService[];
        flightDuration?: number;
        destinationFound?: Geocoder.DestinationFoundFunction;
    });
    /**
     * Gets or sets a value indicating if this instance should always show its text input field.
     */
    keepExpanded: boolean;
    /**
     * True if the geocoder should query as the user types to autocomplete
     */
    autoComplete: boolean;
    /**
     * Gets and sets the command called when a geocode destination is found
     */
    destinationFound: Geocoder.DestinationFoundFunction;
    /**
     * Gets a value indicating whether a search is currently in progress.  This property is observable.
     */
    isSearchInProgress: boolean;
    /**
     * Gets or sets the text to search for.  The text can be an address, or longitude, latitude,
     * and optional height, where longitude and latitude are in degrees and height is in meters.
     */
    searchText: string;
    /**
     * Gets or sets the the duration of the camera flight in seconds.
     * A value of zero causes the camera to instantly switch to the geocoding location.
     * The duration will be computed based on the distance when undefined.
     */
    flightDuration: number | undefined;
    /**
     * Gets the event triggered on flight completion.
     */
    complete: Event;
    /**
     * Gets the scene to control.
     */
    scene: Scene;
    /**
     * Gets the Command that is executed when the button is clicked.
     */
    search: Command;
    /**
     * Gets the currently selected geocoder search suggestion
     */
    selectedSuggestion: any;
    /**
     * Gets the list of geocoder search suggestions
     */
    suggestions: object[];
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
    /**
     * A function to fly to the destination found by a successful geocode.
     */
    static flyToDestination: Geocoder.DestinationFoundFunction;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * A single button widget for returning to the default camera view of the current scene.
 * @param container - The DOM element or ID that will contain the widget.
 * @param scene - The Scene instance to use.
 * @param [duration] - The time, in seconds, it takes to complete the camera flight home.
 */
export class HomeButton {
    constructor(container: Element | string, scene: Scene, duration?: number);
    /**
     * Gets the parent container.
     */
    container: Element;
    /**
     * Gets the view model.
     */
    viewModel: HomeButtonViewModel;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * The view model for {@link HomeButton}.
 * @param scene - The scene instance to use.
 * @param [duration] - The duration of the camera flight in seconds.
 */
export class HomeButtonViewModel {
    constructor(scene: Scene, duration?: number);
    /**
     * Gets or sets the tooltip.  This property is observable.
     */
    tooltip: string;
    /**
     * Gets the scene to control.
     */
    scene: Scene;
    /**
     * Gets the Command that is executed when the button is clicked.
     */
    command: Command;
    /**
     * Gets or sets the the duration of the camera flight in seconds.
     * A value of zero causes the camera to instantly switch to home view.
     * The duration will be computed based on the distance when undefined.
     */
    duration: number | undefined;
}

/**
 * I3S Building Scene Layer widget
 * @param containerId - The DOM element ID that will contain the widget.
 * @param i3sProvider - I3S Data provider instance.
 */
export class I3SBuildingSceneLayerExplorer {
    constructor(containerId: string, i3sProvider: I3SDataProvider);
}

/**
 * The view model for {@link I3SBuildingSceneLayerExplorer}.
 * @param i3sProvider - I3S Data provider instance.
 */
export class I3sBslExplorerViewModel {
    constructor(i3sProvider: I3SDataProvider);
}

/**
 * A widget for displaying information or a description.
 * @param container - The DOM element or ID that will contain the widget.
 */
export class InfoBox {
    constructor(container: Element | string);
    /**
     * Gets the parent container.
     */
    container: Element;
    /**
     * Gets the view model.
     */
    viewModel: InfoBoxViewModel;
    /**
     * Gets the iframe used to display the description.
     */
    frame: HTMLIFrameElement;
    /**
     * @returns true if the object has been destroyed, false otherwise.
     */
    isDestroyed(): boolean;
    /**
     * Destroys the widget.  Should be called if permanently
     * removing the widget from layout.
     */
    destroy(): void;
}

/**
 * The view model for {@link InfoBox}.
 */
export class InfoBoxViewModel {
    constructor();
    /**
     * Gets or sets the maximum height of the info box in pixels.  This property is observable.
     */
    maxHeight: number;
    /**
     * Gets or sets whether the camera tracking icon is enabled.
     */
    enableCamera: boolean;
    /**
     * Get