@vcmap/core 6.1.11 → 6.2.0-rc.2

package/dist/src/panorama/panoramaTile.d.ts

@@ -0,0 +1,23 @@
+import { Primitive, type Matrix4 } from '@vcmap-cesium/engine';
+import type { Size } from 'ol/size.js';
+import PanoramaTileMaterial from './panoramaTileMaterial.js';
+import type { PanoramaTileCoordinate } from './panoramaTileCoordinate.js';
+import type PanoramaMap from '../map/panoramaMap.js';
+import type { PanoramaResourceData, PanoramaResourceType } from './panoramaTileProvider.js';
+export type PanoramaTile = {
+    hasResource(type: PanoramaResourceType): boolean;
+    setResource<T extends PanoramaResourceType>(type: T, resource: PanoramaResourceData<T>): void;
+    getDepthAtPixel(x: number, y: number): number | undefined;
+    readonly tileCoordinate: PanoramaTileCoordinate;
+    getPrimitive(map: PanoramaMap): Primitive;
+    getMaterial(map: PanoramaMap): PanoramaTileMaterial | undefined;
+    destroy(): void;
+};
+/**
+ * Creates a panorama tile primitive with the given tile coordinate and image. Typically only called
+ * by the PanoramaTileProvider when creating tiles.
+ * @param tileCoordinate
+ * @param modelMatrix
+ * @param tileSize
+ */
+export declare function createPanoramaTile(tileCoordinate: PanoramaTileCoordinate, modelMatrix: Matrix4, tileSize: Size): PanoramaTile;

package/dist/src/panorama/panoramaTile.js

@@ -0,0 +1,101 @@
+import { Cartesian3, EllipsoidGeometry, GeometryInstance, MaterialAppearance, Primitive, VertexFormat, } from '@vcmap-cesium/engine';
+import PanoramaTileMaterial from './panoramaTileMaterial.js';
+import { tileSizeInRadians } from './panoramaTileCoordinate.js';
+function createPanoramaTilePrimitive({ x, y, level }, modelMatrix, material) {
+    const sizeR = tileSizeInRadians(level);
+    const heading = x * sizeR;
+    const tilt = y * sizeR;
+    return new Primitive({
+        geometryInstances: [
+            new GeometryInstance({
+                geometry: new EllipsoidGeometry({
+                    vertexFormat: VertexFormat.POSITION_AND_ST,
+                    radii: new Cartesian3(1, 1, 1),
+                    minimumClock: heading,
+                    maximumClock: heading + sizeR,
+                    minimumCone: tilt,
+                    maximumCone: tilt + sizeR,
+                    stackPartitions: (level + 1) * 64,
+                    slicePartitions: (level + 1) * 64,
+                }),
+            }),
+        ],
+        appearance: new MaterialAppearance({
+            material,
+            closed: false,
+            flat: true,
+        }),
+        modelMatrix,
+    });
+}
+/**
+ * Creates a panorama tile primitive with the given tile coordinate and image. Typically only called
+ * by the PanoramaTileProvider when creating tiles.
+ * @param tileCoordinate
+ * @param modelMatrix
+ * @param tileSize
+ */
+export function createPanoramaTile(tileCoordinate, modelMatrix, tileSize) {
+    let destroyed = false;
+    const primitives = new Map();
+    let resources = {};
+    return {
+        get tileCoordinate() {
+            return tileCoordinate;
+        },
+        hasResource(type) {
+            return resources[type] != null;
+        },
+        setResource(type, resource) {
+            if (this.hasResource(type)) {
+                throw new Error(`Resource of type "${type}" already set for this tile. Cannot overwrite.`);
+            }
+            resources[type] = resource;
+            primitives.forEach(({ material }) => {
+                material.setTexture(type, resource);
+            });
+        },
+        getPrimitive(map) {
+            if (destroyed) {
+                throw new Error('Cannot get primitive from destroyed panorama tile.');
+            }
+            if (primitives.has(map)) {
+                return primitives.get(map).primitive;
+            }
+            const material = new PanoramaTileMaterial(tileCoordinate, tileSize);
+            Object.entries(resources).forEach(([type, resource]) => {
+                material.setTexture(type, resource);
+            });
+            const primitive = createPanoramaTilePrimitive(tileCoordinate, modelMatrix, material);
+            primitives.set(map, { primitive, material });
+            return primitive;
+        },
+        getMaterial(map) {
+            if (primitives.has(map)) {
+                return primitives.get(map).material;
+            }
+            return undefined;
+        },
+        /**
+         * Returns the normalized depth value [0, 1] at the given pixel coordinates in the panorama tile.
+         * @param x
+         * @param y
+         */
+        getDepthAtPixel(x, y) {
+            if (!resources.depth) {
+                return undefined;
+            }
+            const index = y * tileSize[0] + x;
+            return resources.depth[index];
+        },
+        destroy() {
+            destroyed = true;
+            resources = {};
+            primitives.forEach(({ primitive, material }) => {
+                primitive.destroy();
+                material.destroy();
+            });
+        },
+    };
+}
+//# sourceMappingURL=panoramaTile.js.map

package/dist/src/panorama/panoramaTile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panoramaTile.js","sourceRoot":"","sources":["../../../src/panorama/panoramaTile.ts"],"names":[],"mappings":"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"}

package/dist/src/panorama/panoramaTileCache.d.ts

@@ -0,0 +1,16 @@
+import LRUCache from 'ol/structs/LRUCache.js';
+import type { PanoramaTile } from './panoramaTile.js';
+/**
+ * A specialized LRU cache
+ */
+export declare class PanoramaTileCache extends LRUCache<PanoramaTile> {
+    deleteOldest(): void;
+    expireCache(usedTiles?: Record<string, boolean>): void;
+}
+/**
+ * convenience function to cache a tile and cleanup all the non-visible tiles
+ * @param tile
+ * @param cache
+ * @param currentlyVisibleTileKeys
+ */
+export declare function addTileToCache(tile: PanoramaTile, cache: PanoramaTileCache, currentlyVisibleTileKeys: Record<string, boolean>): void;

package/dist/src/panorama/panoramaTileCache.js

@@ -0,0 +1,34 @@
+import LRUCache from 'ol/structs/LRUCache.js';
+/**
+ * A specialized LRU cache
+ */
+export class PanoramaTileCache extends LRUCache {
+    deleteOldest() {
+        const entry = this.pop();
+        if (entry) {
+            entry.destroy();
+        }
+    }
+    expireCache(usedTiles = {}) {
+        while (this.canExpireCache()) {
+            const tile = this.peekLast();
+            if (usedTiles[tile.tileCoordinate.key]) {
+                break;
+            }
+            else {
+                this.pop().destroy();
+            }
+        }
+    }
+}
+/**
+ * convenience function to cache a tile and cleanup all the non-visible tiles
+ * @param tile
+ * @param cache
+ * @param currentlyVisibleTileKeys
+ */
+export function addTileToCache(tile, cache, currentlyVisibleTileKeys) {
+    cache.set(tile.tileCoordinate.key, tile);
+    cache.expireCache(currentlyVisibleTileKeys);
+}
+//# sourceMappingURL=panoramaTileCache.js.map

package/dist/src/panorama/panoramaTileCache.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panoramaTileCache.js","sourceRoot":"","sources":["../../../src/panorama/panoramaTileCache.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,wBAAwB,CAAC;AAG9C;;GAEG;AACH,MAAM,OAAO,iBAAkB,SAAQ,QAAsB;IAC3D,YAAY;QACV,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,EAAE,CAAC;QACzB,IAAI,KAAK,EAAE,CAAC;YACV,KAAK,CAAC,OAAO,EAAE,CAAC;QAClB,CAAC;IACH,CAAC;IAED,WAAW,CAAC,YAAqC,EAAE;QACjD,OAAO,IAAI,CAAC,cAAc,EAAE,EAAE,CAAC;YAC7B,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;YAC7B,IAAI,SAAS,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,EAAE,CAAC;gBACvC,MAAM;YACR,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC;YACvB,CAAC;QACH,CAAC;IACH,CAAC;CACF;AAED;;;;;GAKG;AACH,MAAM,UAAU,cAAc,CAC5B,IAAkB,EAClB,KAAwB,EACxB,wBAAiD;IAEjD,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;IACzC,KAAK,CAAC,WAAW,CAAC,wBAAwB,CAAC,CAAC;AAC9C,CAAC"}

package/dist/src/panorama/panoramaTileCoordinate.d.ts

@@ -0,0 +1,56 @@
+import type { Extent } from 'ol/extent.js';
+import type { Size } from 'ol/size.js';
+/**
+ * Tile coordinate in format [x, y, level]
+ */
+export type PanoramaTileCoordinate = {
+    readonly x: number;
+    readonly y: number;
+    readonly level: number;
+    readonly key: string;
+};
+/**
+ * Calculates the number of tiles in the given level.
+ * @param level
+ */
+export declare function getNumberOfTiles(level: number): Size;
+export declare function createTileCoordinate(x: number, y: number, level: number): PanoramaTileCoordinate;
+/**
+ * Creates a tile coordinate from a the key string of a tile coordinate.
+ * The key is semantic and has the following structure: `level/x/y`
+ * @param key
+ */
+export declare function createTileCoordinateFromKey(key: string): PanoramaTileCoordinate;
+/**
+ * Calculates the tile size in radians for the given level.
+ * @param level
+ */
+export declare function tileSizeInRadians(level: number): number;
+/**
+ * Calculates the tile coordinates from the given image spherical coordinate & level.
+ * @param spherical
+ * @param level
+ */
+export declare function tileCoordinateFromImageCoordinate(spherical: [number, number], level: number): PanoramaTileCoordinate;
+/**
+ * Get the tile coordinates of all tiles which intersect the given extent of image coordinates for the given level.
+ * @param extent
+ * @param level
+ */
+export declare function getTileCoordinatesInImageExtent(extent: Extent, level: number): PanoramaTileCoordinate[];
+/**
+ * Gets the center point of a tile in image spherical coordinates.
+ * @param tileCoordinate
+ */
+export declare function getTileSphericalCenter(tileCoordinate: PanoramaTileCoordinate): [number, number];
+/**
+ * Gets the extent of a tile in image spherical coordinates.
+ * @param tileCoordinate
+ */
+export declare function getTileSphericalExtent(tileCoordinate: PanoramaTileCoordinate): [number, number, number, number];
+/**
+ * @param tileCoordinate - the tile coordinate to calculate the distance to
+ * @param position - the image spherical position to calculate the distance from
+ * @returns the distance in radians. this is only used for relative comparisons.
+ */
+export declare function getDistanceToTileCoordinate(position: [number, number], tileCoordinate: PanoramaTileCoordinate): number;

package/dist/src/panorama/panoramaTileCoordinate.js

@@ -0,0 +1,110 @@
+import { Math as CesiumMath } from '@vcmap-cesium/engine';
+import { cartesian2DDistance } from '../util/math.js';
+/**
+ * Calculates the number of tiles in the given level.
+ * @param level
+ */
+export function getNumberOfTiles(level) {
+    const maxX = 2 ** level * 2;
+    const maxY = 2 ** level;
+    return [maxX, maxY];
+}
+export function createTileCoordinate(x, y, level) {
+    return {
+        x,
+        y,
+        level,
+        key: `${level}/${x}/${y}`,
+    };
+}
+/**
+ * Creates a tile coordinate from a the key string of a tile coordinate.
+ * The key is semantic and has the following structure: `level/x/y`
+ * @param key
+ */
+export function createTileCoordinateFromKey(key) {
+    const keys = key.split('/').map(Number).filter(Number.isFinite);
+    if (keys.length === 3) {
+        return createTileCoordinate(keys[1], keys[2], keys[0]);
+    }
+    throw new Error(`Provided key "${key}" is not a valid tile coordinate key`);
+}
+/**
+ * Calculates the tile size in radians for the given level.
+ * @param level
+ */
+export function tileSizeInRadians(level) {
+    return CesiumMath.PI / 2 ** level;
+}
+/**
+ * Calculates the tile coordinates from the given image spherical coordinate & level.
+ * @param spherical
+ * @param level
+ */
+export function tileCoordinateFromImageCoordinate(spherical, level) {
+    const tileSize = tileSizeInRadians(level);
+    const [numTilesX] = getNumberOfTiles(level);
+    let tileX = numTilesX - 1 - Math.floor(spherical[0] / tileSize);
+    const tileY = Math.floor(spherical[1] / tileSize);
+    if (tileX < 0) {
+        // wrap around 2 * PI
+        tileX = numTilesX + tileX;
+    }
+    return createTileCoordinate(tileX, tileY, level);
+}
+/**
+ * Get the tile coordinates of all tiles which intersect the given extent of image coordinates for the given level.
+ * @param extent
+ * @param level
+ */
+export function getTileCoordinatesInImageExtent(extent, level) {
+    // the extent is flipped along the X axis, we need to take this into account.
+    const bottomLeft = tileCoordinateFromImageCoordinate([extent[2], extent[1]], level);
+    const topRight = tileCoordinateFromImageCoordinate([extent[0], extent[3]], level);
+    const numberOfLines = topRight.y - bottomLeft.y;
+    const tileCoordinates = new Array((topRight.x - bottomLeft.x) * numberOfLines);
+    for (let i = bottomLeft.x; i <= topRight.x; i++) {
+        for (let j = bottomLeft.y; j <= topRight.y; j++) {
+            tileCoordinates[(i - bottomLeft.x) * (numberOfLines + 1) + (j - bottomLeft.y)] = createTileCoordinate(i, j, level);
+        }
+    }
+    return tileCoordinates;
+}
+/**
+ * Gets the center point of a tile in image spherical coordinates.
+ * @param tileCoordinate
+ */
+export function getTileSphericalCenter(tileCoordinate) {
+    const sizeR = tileSizeInRadians(tileCoordinate.level);
+    const [numTilesX] = getNumberOfTiles(tileCoordinate.level);
+    const phi = (numTilesX - 1 - (tileCoordinate.x - 0.5)) * sizeR;
+    const theta = (tileCoordinate.y + 0.5) * sizeR;
+    return [phi, theta];
+}
+/**
+ * Gets the extent of a tile in image spherical coordinates.
+ * @param tileCoordinate
+ */
+export function getTileSphericalExtent(tileCoordinate) {
+    const sizeR = tileSizeInRadians(tileCoordinate.level);
+    const [numTilesX] = getNumberOfTiles(tileCoordinate.level);
+    const minPhi = (numTilesX - 1 - tileCoordinate.x) * sizeR;
+    const maxPhi = (numTilesX - 1 - (tileCoordinate.x - 1)) * sizeR;
+    const minTheta = tileCoordinate.y * sizeR;
+    const maxTheta = (tileCoordinate.y + 1) * sizeR;
+    return [minPhi, minTheta, maxPhi, maxTheta];
+}
+/**
+ * @param tileCoordinate - the tile coordinate to calculate the distance to
+ * @param position - the image spherical position to calculate the distance from
+ * @returns the distance in radians. this is only used for relative comparisons.
+ */
+export function getDistanceToTileCoordinate(position, tileCoordinate) {
+    const center = getTileSphericalCenter(tileCoordinate);
+    const distance = cartesian2DDistance(position, center);
+    if (distance > Math.PI) {
+        return Math.abs(CesiumMath.TWO_PI - distance);
+    }
+    return distance;
+}
+//# sourceMappingURL=panoramaTileCoordinate.js.map

package/dist/src/panorama/panoramaTileCoordinate.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"panoramaTileCoordinate.js","sourceRoot":"","sources":["../../../src/panorama/panoramaTileCoordinate.ts"],"names":[],"mappings":"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"}

package/dist/src/panorama/panoramaTileMaterial.d.ts

@@ -0,0 +1,96 @@
+import type { Context } from '@vcmap-cesium/engine';
+import { Cartesian2, Cartesian3, Color, Material, Texture } from '@vcmap-cesium/engine';
+import type { Size } from 'ol/size.js';
+import { type PanoramaTileCoordinate } from './panoramaTileCoordinate.js';
+import type { PanoramaResourceData, PanoramaResourceType } from './panoramaTileProvider.js';
+export declare const defaultCursorColor = "rgba(255, 206, 0, 0.33)";
+/**
+ * The overlay mode for panorama tiles.
+ */
+export declare enum PanoramaOverlayMode {
+    None = 0,
+    Intensity = 1,
+    Depth = 2
+}
+export type PanoramaTileMaterialUniforms = {
+    u_rgb: ImageBitmap | string;
+    u_intensity: ImageBitmap | string;
+    u_depth: Texture | string;
+    u_debug: HTMLCanvasElement | string;
+    u_cursorPosition: Cartesian3;
+    u_minUV: Cartesian2;
+    u_maxUV: Cartesian2;
+    u_opacity: number;
+    u_overlay: PanoramaOverlayMode;
+    u_overlayOpacity: number;
+    u_overlayNaNColor: Color;
+    u_showDebug: boolean;
+    u_depthReady: boolean;
+    u_imageReady: boolean;
+    u_intensityReady: boolean;
+    u_cursorColor: Color;
+};
+export declare function getDefaultPanoramaTileMaterialUniforms(): PanoramaTileMaterialUniforms;
+export default class PanoramaTileMaterial extends Material {
+    readonly tileCoordinate: PanoramaTileCoordinate;
+    private _tileSize;
+    private _loadedImages;
+    /**
+     * The uniforms used by the panorama tile material. These are not intended to be modified directly
+     * but rather through the provided properties.
+     */
+    uniforms: PanoramaTileMaterialUniforms;
+    private _minificationFilter;
+    private _magnificationFilter;
+    private _depthData;
+    constructor(tileCoordinate: PanoramaTileCoordinate, _tileSize: Size);
+    /**
+     * Shows the debug overlay on the panorama tile.
+     */
+    get showDebug(): boolean;
+    set showDebug(value: boolean);
+    /**
+     * Display the overlay on the panorama tile.
+     */
+    get overlay(): PanoramaOverlayMode;
+    set overlay(value: PanoramaOverlayMode);
+    /**
+     * The opacity of the overlay on the panorama tile.
+     */
+    get overlayOpacity(): number;
+    set overlayOpacity(value: number);
+    /**
+     * The color used where overlay values are 0.
+     */
+    get overlayNaNColor(): Color;
+    set overlayNaNColor(value: Color);
+    /**
+     * The global opacity of the panorama tile.
+     */
+    get opacity(): number;
+    set opacity(value: number);
+    /**
+     * The position of the cursor in the panorama tile. Internal API to render the depth cursor.
+     * (-1, -1, -1) means no data is available.
+     * It should be a valid position in the panorama tiles cartesian coordinate system, scaled by the normalized depth.
+     */
+    get cursorPosition(): Cartesian3;
+    set cursorPosition(value: Cartesian3);
+    /**
+     * The color of the cursor in the panorama tile.
+     */
+    get cursorColor(): Color;
+    set cursorColor(value: Color);
+    /**
+     * Sets the texture for the given panorama resource type.
+     * @param type
+     * @param data
+     */
+    setTexture<T extends PanoramaResourceType>(type: T, data: PanoramaResourceData<T>): void;
+    hasTexture(type: PanoramaResourceType): boolean;
+    /**
+     * Internal cesium API to update the material.
+     * @param context
+     */
+    update(context: Context): void;
+}

package/dist/src/panorama/panoramaTileMaterial.js

@@ -0,0 +1,213 @@
+import { Cartesian2, Cartesian3, Color, Material, PixelDatatype, PixelFormat, Sampler, Texture, } from '@vcmap-cesium/engine';
+import { getNumberOfTiles, } from './panoramaTileCoordinate.js';
+import source from './panoramaTileMaterialFS.shader.js';
+export const defaultCursorColor = 'rgba(255, 206, 0, 0.33)';
+/**
+ * The overlay mode for panorama tiles.
+ */
+export var PanoramaOverlayMode;
+(function (PanoramaOverlayMode) {
+    PanoramaOverlayMode[PanoramaOverlayMode["None"] = 0] = "None";
+    PanoramaOverlayMode[PanoramaOverlayMode["Intensity"] = 1] = "Intensity";
+    PanoramaOverlayMode[PanoramaOverlayMode["Depth"] = 2] = "Depth";
+})(PanoramaOverlayMode || (PanoramaOverlayMode = {}));
+function createDebugCanvas(tileSize, text) {
+    const canvas = document.createElement('canvas');
+    canvas.width = tileSize[0];
+    canvas.height = tileSize[1];
+    const ctx = canvas.getContext('2d');
+    ctx.strokeStyle = 'hotpink';
+    ctx.lineWidth = 5;
+    ctx.strokeRect(0, 0, tileSize[0], tileSize[1]);
+    ctx.translate(tileSize[0], 0);
+    ctx.scale(-1, 1); // Flip the context horizontally
+    ctx.fillStyle = 'hotpink';
+    ctx.font = '60px Arial';
+    ctx.textAlign = 'center';
+    ctx.textBaseline = 'middle';
+    ctx.fillText(text, tileSize[0] / 2, tileSize[1] / 2);
+    return canvas;
+}
+function getUniformForType(type) {
+    return `u_${type}`;
+}
+export function getDefaultPanoramaTileMaterialUniforms() {
+    return {
+        u_rgb: Material.DefaultImageId,
+        u_intensity: Material.DefaultImageId,
+        u_depth: Material.DefaultImageId,
+        u_debug: Material.DefaultImageId,
+        u_minUV: new Cartesian2(),
+        u_maxUV: new Cartesian2(),
+        u_opacity: 1,
+        u_overlay: PanoramaOverlayMode.Intensity,
+        u_overlayOpacity: 1,
+        u_showDebug: false,
+        u_cursorPosition: new Cartesian3(-1, -1, -1),
+        u_imageReady: false,
+        u_intensityReady: false,
+        u_depthReady: false,
+        u_overlayNaNColor: Color.RED,
+        u_cursorColor: Color.fromCssColorString(defaultCursorColor),
+    };
+}
+export default class PanoramaTileMaterial extends Material {
+    tileCoordinate;
+    _tileSize;
+    _depthData;
+    constructor(tileCoordinate, _tileSize) {
+        const [numx, numy] = getNumberOfTiles(tileCoordinate.level);
+        const sizeX = 1 / numx;
+        const sizeY = 1 / numy;
+        const { x, y } = tileCoordinate;
+        const minUV = new Cartesian2(x * sizeX, 1 - (y * sizeY + sizeY));
+        const maxUV = new Cartesian2(x * sizeX + sizeX, 1 - y * sizeY);
+        super({
+            fabric: {
+                type: 'TileImage',
+                uniforms: {
+                    ...getDefaultPanoramaTileMaterialUniforms(),
+                    u_minUV: minUV,
+                    u_maxUV: maxUV,
+                },
+                source,
+            },
+            translucent: false,
+        });
+        this.tileCoordinate = tileCoordinate;
+        this._tileSize = _tileSize;
+    }
+    /**
+     * Shows the debug overlay on the panorama tile.
+     */
+    get showDebug() {
+        return this.uniforms.u_showDebug;
+    }
+    set showDebug(value) {
+        this.uniforms.u_showDebug = value;
+        if (value && this.uniforms.u_debug === Material.DefaultImageId) {
+            this.uniforms.u_debug = createDebugCanvas(this._tileSize, this.tileCoordinate.key);
+        }
+    }
+    /**
+     * Display the overlay on the panorama tile.
+     */
+    get overlay() {
+        return this.uniforms.u_overlay;
+    }
+    set overlay(value) {
+        this.uniforms.u_overlay = value;
+    }
+    /**
+     * The opacity of the overlay on the panorama tile.
+     */
+    get overlayOpacity() {
+        return this.uniforms.u_overlayOpacity;
+    }
+    set overlayOpacity(value) {
+        this.uniforms.u_overlayOpacity = value;
+    }
+    /**
+     * The color used where overlay values are 0.
+     */
+    get overlayNaNColor() {
+        return this.uniforms.u_overlayNaNColor;
+    }
+    set overlayNaNColor(value) {
+        this.uniforms.u_overlayNaNColor = value;
+    }
+    /**
+     * The global opacity of the panorama tile.
+     */
+    get opacity() {
+        return this.uniforms.u_opacity;
+    }
+    set opacity(value) {
+        this.uniforms.u_opacity = value;
+    }
+    /**
+     * The position of the cursor in the panorama tile. Internal API to render the depth cursor.
+     * (-1, -1, -1) means no data is available.
+     * It should be a valid position in the panorama tiles cartesian coordinate system, scaled by the normalized depth.
+     */
+    get cursorPosition() {
+        return this.uniforms.u_cursorPosition;
+    }
+    set cursorPosition(value) {
+        this.uniforms.u_cursorPosition = value;
+    }
+    /**
+     * The color of the cursor in the panorama tile.
+     */
+    get cursorColor() {
+        return this.uniforms.u_cursorColor;
+    }
+    set cursorColor(value) {
+        this.uniforms.u_cursorColor = value;
+    }
+    /**
+     * Sets the texture for the given panorama resource type.
+     * @param type
+     * @param data
+     */
+    setTexture(type, data) {
+        if (this.hasTexture(type)) {
+            throw new Error(`Texture for ${type} can only be set once!`);
+        }
+        const uniformType = getUniformForType(type);
+        if (uniformType === 'u_depth') {
+            this._depthData = data;
+        }
+        else {
+            this.uniforms[uniformType] = data;
+        }
+    }
+    hasTexture(type) {
+        const uniform = getUniformForType(type);
+        if (uniform === 'u_depth') {
+            return this._depthData !== undefined;
+        }
+        return this.uniforms[uniform] !== Material.DefaultImageId;
+    }
+    /**
+     * Internal cesium API to update the material.
+     * @param context
+     */
+    update(context) {
+        const resolveImage = !this.uniforms.u_imageReady &&
+            this._loadedImages?.some((i) => i.id === 'u_rgb');
+        const resolveIntensity = !this.uniforms.u_intensityReady &&
+            this._loadedImages?.find((i) => i.id === 'u_intensity');
+        if (this.uniforms.u_depth === Material.DefaultImageId && this._depthData) {
+            const sampler = new Sampler({
+                minificationFilter: this._minificationFilter,
+                magnificationFilter: this._magnificationFilter,
+            });
+            this.uniforms.u_depth = new Texture({
+                context,
+                pixelDatatype: PixelDatatype.FLOAT,
+                pixelFormat: PixelFormat.RED,
+                source: {
+                    arrayBufferView: this._depthData,
+                    width: this._tileSize[0],
+                    height: this._tileSize[1],
+                },
+                sampler,
+            });
+        }
+        else if (!this.uniforms.u_depthReady &&
+            this.uniforms.u_depth !== Material.DefaultImageId) {
+            this.uniforms.u_depthReady = true;
+        }
+        // @ts-expect-error is actually private
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-call
+        super.update(context);
+        if (resolveImage) {
+            this.uniforms.u_imageReady = true;
+        }
+        if (resolveIntensity) {
+            this.uniforms.u_intensityReady = true;
+        }
+    }
+}
+//# sourceMappingURL=panoramaTileMaterial.js.map