astro-viewer 2.0.0 → 3.0.0

package/lib-esm/model/earth/XYZMeshBuilder.js

@@ -0,0 +1,97 @@
+import { sphericalToCartesian } from '../../utils/Utils.js';
+const MAX_MERCATOR_LAT = 85.0511287798066;
+function mercatorYToLatDeg(yNormalized) {
+    const mercator = Math.PI * (1 - 2 * yNormalized);
+    return (Math.atan(Math.sinh(mercator)) * 180) / Math.PI;
+}
+function wrapLonToPhi(lonDeg) {
+    return lonDeg < 0 ? lonDeg + 360 : lonDeg;
+}
+export class XYZMeshBuilder {
+    buildTileMesh(tile, segmentsPerSide = 16) {
+        const segments = Math.max(1, Math.floor(segmentsPerSide));
+        const gridSize = segments + 1;
+        const vertexCount = gridSize * gridSize;
+        const positions = new Float32Array(vertexCount * 3);
+        const uvs = new Float32Array(vertexCount * 2);
+        const tileCount = 2 ** tile.z;
+        let p = 0;
+        let uv = 0;
+        for (let row = 0; row <= segments; row++) {
+            const v = row / segments;
+            const yNormalized = (tile.y + v) / tileCount;
+            const latDeg = Math.max(-MAX_MERCATOR_LAT, Math.min(MAX_MERCATOR_LAT, mercatorYToLatDeg(yNormalized)));
+            const thetaDeg = 90 - latDeg;
+            for (let col = 0; col <= segments; col++) {
+                const u = col / segments;
+                const xNormalized = (tile.x + u) / tileCount;
+                const lonDeg = xNormalized * 360 - 180;
+                const phiDeg = wrapLonToPhi(lonDeg);
+                const [x, y, z] = sphericalToCartesian(phiDeg, thetaDeg, 1);
+                positions[p++] = x;
+                positions[p++] = y;
+                positions[p++] = z;
+                uvs[uv++] = u;
+                uvs[uv++] = 1 - v;
+            }
+        }
+        const triangleCount = segments * segments * 2;
+        const rawIndices = new Uint32Array(triangleCount * 3);
+        let i = 0;
+        for (let row = 0; row < segments; row++) {
+            for (let col = 0; col < segments; col++) {
+                const topLeft = row * gridSize + col;
+                const topRight = topLeft + 1;
+                const bottomLeft = topLeft + gridSize;
+                const bottomRight = bottomLeft + 1;
+                rawIndices[i++] = topLeft;
+                rawIndices[i++] = bottomLeft;
+                rawIndices[i++] = topRight;
+                rawIndices[i++] = topRight;
+                rawIndices[i++] = bottomLeft;
+                rawIndices[i++] = bottomRight;
+            }
+        }
+        const indices = rawIndices.length > 65535 ? rawIndices : new Uint16Array(rawIndices);
+        return { positions, uvs, indices };
+    }
+    buildAncestorMesh(targetTile, ancestorTile, segmentsPerSide = 16) {
+        const baseMesh = this.buildTileMesh(targetTile, segmentsPerSide);
+        const dz = targetTile.z - ancestorTile.z;
+        const scale = 2 ** dz;
+        const subTileX = targetTile.x - (ancestorTile.x << dz);
+        const subTileY = targetTile.y - (ancestorTile.y << dz);
+        const uvs = new Float32Array(baseMesh.uvs.length);
+        for (let i = 0; i < baseMesh.uvs.length; i += 2) {
+            const u = baseMesh.uvs[i] ?? 0;
+            const baseV = baseMesh.uvs[i + 1] ?? 0;
+            const v = 1 - baseV;
+            uvs[i] = (subTileX + u) / scale;
+            uvs[i + 1] = 1 - (subTileY + v) / scale;
+        }
+        return {
+            positions: baseMesh.positions,
+            uvs,
+            indices: baseMesh.indices,
+        };
+    }
+    uploadMesh(mesh, webgl) {
+        const positionBuffer = webgl.createBuffer();
+        const uvBuffer = webgl.createBuffer();
+        const indexBuffer = webgl.createBuffer();
+        const indexType = mesh.indices instanceof Uint32Array ? webgl.UNSIGNED_INT : webgl.UNSIGNED_SHORT;
+        webgl.bindBuffer(webgl.ARRAY_BUFFER, positionBuffer);
+        webgl.bufferData(webgl.ARRAY_BUFFER, mesh.positions, webgl.STATIC_DRAW);
+        webgl.bindBuffer(webgl.ARRAY_BUFFER, uvBuffer);
+        webgl.bufferData(webgl.ARRAY_BUFFER, mesh.uvs, webgl.STATIC_DRAW);
+        webgl.bindBuffer(webgl.ELEMENT_ARRAY_BUFFER, indexBuffer);
+        webgl.bufferData(webgl.ELEMENT_ARRAY_BUFFER, mesh.indices, webgl.STATIC_DRAW);
+        return {
+            positionBuffer,
+            uvBuffer,
+            indexBuffer,
+            indexCount: mesh.indices.length,
+            indexType,
+        };
+    }
+}

package/lib-esm/model/earth/XYZTile.d.ts

@@ -0,0 +1,39 @@
+import { XYZShaderProgram } from '../../shader/XYZShaderProgram.js';
+import type { XYZTileCoord, XYZTileGpuMesh, XYZTileMesh } from './types.js';
+export declare class XYZTile {
+    private _coord;
+    private _url;
+    private _webgl;
+    private _shaderProgram;
+    private _positionBuffer;
+    private _uvBuffer;
+    private _indexBuffer;
+    private _texture;
+    private _indices;
+    private _indexType;
+    private _ready;
+    private _aborted;
+    private _loading;
+    private _failedUntil;
+    private _lastUsedAt;
+    private _createdAt;
+    private _image?;
+    private _objectUrl;
+    constructor(coord: XYZTileCoord, url: string, mesh: XYZTileMesh, webgl: WebGL2RenderingContext, shaderProgram: XYZShaderProgram);
+    get ready(): boolean;
+    get coord(): XYZTileCoord;
+    get failedUntil(): number;
+    get loading(): boolean;
+    get lastUsedAt(): number;
+    get createdAt(): number;
+    touch(): void;
+    primeLoad(priority?: number): void;
+    private loadTexture;
+    private loadImageFromBlob;
+    private onImageLoaded;
+    draw(pMatrix: Float32Array, vMatrix: Float32Array, mMatrix: Float32Array, priority?: number, allowLoad?: boolean): void;
+    drawRemapped(mesh: XYZTileGpuMesh, pMatrix: Float32Array, vMatrix: Float32Array, mMatrix: Float32Array): void;
+    private drawWithGpuMesh;
+    dispose(): void;
+    private revokeObjectUrl;
+}

package/lib-esm/model/earth/XYZTile.js

@@ -0,0 +1,187 @@
+import { xyzTileRequestScheduler, XYZTileRequestError } from './XYZTileRequestScheduler.js';
+export class XYZTile {
+    _coord;
+    _url;
+    _webgl;
+    _shaderProgram;
+    _positionBuffer;
+    _uvBuffer;
+    _indexBuffer;
+    _texture = null;
+    _indices;
+    _indexType;
+    _ready = false;
+    _aborted = false;
+    _loading = false;
+    _failedUntil = 0;
+    _lastUsedAt = 0;
+    _createdAt = Date.now();
+    _image;
+    _objectUrl = null;
+    constructor(coord, url, mesh, webgl, shaderProgram) {
+        this._coord = coord;
+        this._url = url;
+        this._webgl = webgl;
+        this._shaderProgram = shaderProgram;
+        this._positionBuffer = webgl.createBuffer();
+        this._uvBuffer = webgl.createBuffer();
+        this._indexBuffer = webgl.createBuffer();
+        this._indices = mesh.indices;
+        this._indexType = mesh.indices instanceof Uint32Array ? webgl.UNSIGNED_INT : webgl.UNSIGNED_SHORT;
+        webgl.bindBuffer(webgl.ARRAY_BUFFER, this._positionBuffer);
+        webgl.bufferData(webgl.ARRAY_BUFFER, mesh.positions, webgl.STATIC_DRAW);
+        webgl.bindBuffer(webgl.ARRAY_BUFFER, this._uvBuffer);
+        webgl.bufferData(webgl.ARRAY_BUFFER, mesh.uvs, webgl.STATIC_DRAW);
+        webgl.bindBuffer(webgl.ELEMENT_ARRAY_BUFFER, this._indexBuffer);
+        webgl.bufferData(webgl.ELEMENT_ARRAY_BUFFER, mesh.indices, webgl.STATIC_DRAW);
+    }
+    get ready() {
+        return this._ready;
+    }
+    get coord() {
+        return this._coord;
+    }
+    get failedUntil() {
+        return this._failedUntil;
+    }
+    get loading() {
+        return this._loading;
+    }
+    get lastUsedAt() {
+        return this._lastUsedAt;
+    }
+    get createdAt() {
+        return this._createdAt;
+    }
+    touch() {
+        this._lastUsedAt = Date.now();
+    }
+    primeLoad(priority = 0) {
+        this.loadTexture(priority);
+    }
+    loadTexture(priority = 0) {
+        if (this._loading || this._ready || this._aborted) {
+            return;
+        }
+        const now = Date.now();
+        if (this._failedUntil > now) {
+            return;
+        }
+        this._loading = true;
+        xyzTileRequestScheduler.load(this._url, priority)
+            .then((blob) => this.loadImageFromBlob(blob))
+            .catch((error) => {
+            this._loading = false;
+            this._ready = false;
+            const cooldownMs = error instanceof XYZTileRequestError ? error.cooldownMs : 10000;
+            this._failedUntil = Date.now() + cooldownMs;
+        });
+    }
+    loadImageFromBlob(blob) {
+        const image = new Image();
+        this._image = image;
+        this._objectUrl = URL.createObjectURL(blob);
+        image.onload = () => this.onImageLoaded();
+        image.onerror = () => {
+            this._loading = false;
+            this._ready = false;
+            this._failedUntil = Date.now() + 30000;
+            this.revokeObjectUrl();
+        };
+        image.src = this._objectUrl;
+    }
+    onImageLoaded() {
+        if (!this._image || this._aborted) {
+            return;
+        }
+        const gl = this._webgl;
+        const texture = gl.createTexture();
+        if (!texture) {
+            throw new Error('Could not create XYZ texture');
+        }
+        this._texture = texture;
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D, texture);
+        gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);
+        gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, this._image);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
+        gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
+        this._loading = false;
+        this._failedUntil = 0;
+        this._ready = true;
+        this.revokeObjectUrl();
+    }
+    draw(pMatrix, vMatrix, mMatrix, priority = 0, allowLoad = true) {
+        this.touch();
+        if (!this._ready && allowLoad) {
+            this.loadTexture(priority);
+        }
+        if (!this._ready || !this._texture) {
+            return;
+        }
+        this.drawWithGpuMesh({
+            positionBuffer: this._positionBuffer,
+            uvBuffer: this._uvBuffer,
+            indexBuffer: this._indexBuffer,
+            indexCount: this._indices.length,
+            indexType: this._indexType,
+        }, pMatrix, vMatrix, mMatrix);
+    }
+    drawRemapped(mesh, pMatrix, vMatrix, mMatrix) {
+        this.touch();
+        if (!this._ready || !this._texture) {
+            return;
+        }
+        this.drawWithGpuMesh(mesh, pMatrix, vMatrix, mMatrix);
+    }
+    drawWithGpuMesh(mesh, pMatrix, vMatrix, mMatrix) {
+        if (!this._texture) {
+            return;
+        }
+        const gl = this._webgl;
+        this._shaderProgram.enableShaders(pMatrix, vMatrix, mMatrix);
+        gl.bindBuffer(gl.ARRAY_BUFFER, mesh.positionBuffer);
+        gl.vertexAttribPointer(this._shaderProgram.locations.vertexPositionAttribute, 3, gl.FLOAT, false, 0, 0);
+        gl.enableVertexAttribArray(this._shaderProgram.locations.vertexPositionAttribute);
+        gl.bindBuffer(gl.ARRAY_BUFFER, mesh.uvBuffer);
+        gl.vertexAttribPointer(this._shaderProgram.locations.textureCoordAttribute, 2, gl.FLOAT, false, 0, 0);
+        gl.enableVertexAttribArray(this._shaderProgram.locations.textureCoordAttribute);
+        gl.activeTexture(gl.TEXTURE0);
+        gl.bindTexture(gl.TEXTURE_2D, this._texture);
+        gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, mesh.indexBuffer);
+        gl.drawElements(gl.TRIANGLES, mesh.indexCount, mesh.indexType, 0);
+        gl.disableVertexAttribArray(this._shaderProgram.locations.vertexPositionAttribute);
+        gl.disableVertexAttribArray(this._shaderProgram.locations.textureCoordAttribute);
+    }
+    dispose() {
+        const gl = this._webgl;
+        if (this._texture) {
+            gl.deleteTexture(this._texture);
+            this._texture = null;
+        }
+        if (this._positionBuffer) {
+            gl.deleteBuffer(this._positionBuffer);
+            this._positionBuffer = null;
+        }
+        if (this._uvBuffer) {
+            gl.deleteBuffer(this._uvBuffer);
+            this._uvBuffer = null;
+        }
+        if (this._indexBuffer) {
+            gl.deleteBuffer(this._indexBuffer);
+            this._indexBuffer = null;
+        }
+        this._image = undefined;
+        this.revokeObjectUrl();
+        this._loading = false;
+        this._ready = false;
+    }
+    revokeObjectUrl() {
+        if (this._objectUrl) {
+            URL.revokeObjectURL(this._objectUrl);
+            this._objectUrl = null;
+        }
+    }
+}

package/lib-esm/model/earth/XYZTileBuffer.d.ts

@@ -0,0 +1,39 @@
+import { XYZShaderProgram } from '../../shader/XYZShaderProgram.js';
+import { XYZMeshBuilder } from './XYZMeshBuilder.js';
+import { XYZTile } from './XYZTile.js';
+import type { XYZTileCoord } from './types.js';
+export type XYZTileRequest = {
+    tileCoord: XYZTileCoord;
+    url: string;
+    priority: number;
+    role: 'current' | 'coverage' | 'fallback' | 'base';
+};
+type XYZTileBufferEntry = {
+    tile: XYZTile;
+    cacheTime0?: number;
+    role: 'current' | 'coverage' | 'fallback' | 'base';
+};
+export declare class XYZTileBuffer {
+    private _tiles;
+    private _cachedTiles;
+    private _cacheAliveMilliSeconds;
+    private _cleanerId;
+    private _webgl;
+    private _meshBuilder;
+    private _shaderProgram;
+    constructor(minutesToLiveInCache: number | undefined, webgl: WebGL2RenderingContext, meshBuilder: XYZMeshBuilder, shaderProgram: XYZShaderProgram);
+    get activeTiles(): Map<string, XYZTileBufferEntry>;
+    get cachedTiles(): Map<string, XYZTileBufferEntry>;
+    get size(): number;
+    getTile(tileCoord: XYZTileCoord, url: string, segmentsPerSide: number, role: 'current' | 'coverage' | 'fallback' | 'base'): XYZTile;
+    private getExistingTile;
+    ensureTiles(requests: XYZTileRequest[], segmentsPerSide: number): string[];
+    getActiveTile(tileKey: string): XYZTile | null;
+    getAnyTile(tileKey: string): XYZTile | null;
+    syncVisibleTiles(visibleTileKeys: string[]): void;
+    evictCached(maxCachedTiles: number): void;
+    dispose(): void;
+    private cacheCleaner;
+    private key;
+}
+export {};

package/lib-esm/model/earth/XYZTileBuffer.js

@@ -0,0 +1,149 @@
+import { XYZTile } from './XYZTile.js';
+export class XYZTileBuffer {
+    _tiles = new Map();
+    _cachedTiles = new Map();
+    _cacheAliveMilliSeconds;
+    _cleanerId;
+    _webgl;
+    _meshBuilder;
+    _shaderProgram;
+    constructor(minutesToLiveInCache = 1, webgl, meshBuilder, shaderProgram) {
+        this._cacheAliveMilliSeconds = minutesToLiveInCache * 60 * 1000;
+        this._webgl = webgl;
+        this._meshBuilder = meshBuilder;
+        this._shaderProgram = shaderProgram;
+        this._cleanerId = window.setInterval(() => {
+            this.cacheCleaner();
+        }, 10_000);
+    }
+    get activeTiles() {
+        return this._tiles;
+    }
+    get cachedTiles() {
+        return this._cachedTiles;
+    }
+    get size() {
+        return this._tiles.size + this._cachedTiles.size;
+    }
+    getTile(tileCoord, url, segmentsPerSide, role) {
+        const tileKey = this.key(tileCoord);
+        if (!this._tiles.has(tileKey)) {
+            if (this._cachedTiles.has(tileKey)) {
+                const entry = this._cachedTiles.get(tileKey);
+                entry.cacheTime0 = undefined;
+                entry.role = role;
+                this._tiles.set(tileKey, entry);
+                this._cachedTiles.delete(tileKey);
+            }
+            else {
+                const mesh = this._meshBuilder.buildTileMesh(tileCoord, segmentsPerSide);
+                this._tiles.set(tileKey, {
+                    tile: new XYZTile(tileCoord, url, mesh, this._webgl, this._shaderProgram),
+                    role,
+                });
+            }
+        }
+        else {
+            const entry = this._tiles.get(tileKey);
+            entry.role = role;
+        }
+        return this._tiles.get(tileKey).tile;
+    }
+    getExistingTile(tileCoord, role) {
+        const tileKey = this.key(tileCoord);
+        if (this._tiles.has(tileKey)) {
+            const entry = this._tiles.get(tileKey);
+            entry.role = role;
+            return entry.tile;
+        }
+        if (this._cachedTiles.has(tileKey)) {
+            const entry = this._cachedTiles.get(tileKey);
+            entry.cacheTime0 = undefined;
+            entry.role = role;
+            this._tiles.set(tileKey, entry);
+            this._cachedTiles.delete(tileKey);
+            return entry.tile;
+        }
+        return null;
+    }
+    ensureTiles(requests, segmentsPerSide) {
+        const visibleTileKeys = [];
+        for (const request of requests) {
+            const tile = request.role === 'fallback'
+                ? this.getExistingTile(request.tileCoord, 'fallback')
+                : this.getTile(request.tileCoord, request.url, segmentsPerSide, request.role);
+            if (!tile) {
+                continue;
+            }
+            tile.touch();
+            if (request.role !== 'fallback') {
+                tile.primeLoad(request.priority);
+            }
+            visibleTileKeys.push(this.key(request.tileCoord));
+        }
+        this.syncVisibleTiles(visibleTileKeys);
+        return visibleTileKeys;
+    }
+    getActiveTile(tileKey) {
+        return this._tiles.get(tileKey)?.tile ?? null;
+    }
+    getAnyTile(tileKey) {
+        return this._tiles.get(tileKey)?.tile ?? this._cachedTiles.get(tileKey)?.tile ?? null;
+    }
+    syncVisibleTiles(visibleTileKeys) {
+        const visibleKeySet = new Set(visibleTileKeys);
+        for (const [tileKey, entry] of this._tiles) {
+            if (visibleKeySet.has(tileKey)) {
+                entry.tile.touch();
+                continue;
+            }
+            entry.cacheTime0 = Date.now();
+            this._cachedTiles.set(tileKey, entry);
+            this._tiles.delete(tileKey);
+        }
+    }
+    evictCached(maxCachedTiles) {
+        if (this.size <= maxCachedTiles) {
+            return;
+        }
+        const candidates = Array.from(this._cachedTiles.entries()).sort((a, b) => {
+            const scoreA = Math.min(a[1].tile.lastUsedAt || a[1].tile.createdAt, a[1].tile.createdAt);
+            const scoreB = Math.min(b[1].tile.lastUsedAt || b[1].tile.createdAt, b[1].tile.createdAt);
+            return scoreA - scoreB;
+        });
+        for (const [tileKey, entry] of candidates) {
+            if (this.size <= maxCachedTiles) {
+                break;
+            }
+            if (entry.tile.loading) {
+                continue;
+            }
+            entry.tile.dispose();
+            this._cachedTiles.delete(tileKey);
+        }
+    }
+    dispose() {
+        window.clearInterval(this._cleanerId);
+        for (const entry of this._tiles.values()) {
+            entry.tile.dispose();
+        }
+        for (const entry of this._cachedTiles.values()) {
+            entry.tile.dispose();
+        }
+        this._tiles.clear();
+        this._cachedTiles.clear();
+    }
+    cacheCleaner() {
+        const now = Date.now();
+        for (const [tileKey, entry] of this._cachedTiles) {
+            const t0 = entry.cacheTime0;
+            if (t0 !== undefined && now - t0 > this._cacheAliveMilliSeconds && !entry.tile.loading) {
+                entry.tile.dispose();
+                this._cachedTiles.delete(tileKey);
+            }
+        }
+    }
+    key(tileCoord) {
+        return `${tileCoord.z}/${tileCoord.x}/${tileCoord.y}`;
+    }
+}

package/lib-esm/model/earth/XYZTileProvider.d.ts

@@ -0,0 +1,29 @@
+import { Point } from '../Point.js';
+import type { XYZLayerConfig, XYZTileCoord } from './types.js';
+type ViewCenterSpherical = {
+    phi: number;
+    theta: number;
+};
+export declare class XYZTileProvider {
+    private _config;
+    constructor(config: XYZLayerConfig);
+    get config(): XYZLayerConfig;
+    get minZoom(): number;
+    get maxZoom(): number;
+    getInitialTiles(): XYZTileCoord[];
+    getTileUrl(tile: XYZTileCoord): string;
+    resolveZoom(fovDeg: number): number;
+    private clampZoom;
+    private getEffectiveTileY;
+    private getSubdomain;
+    getVisibleTilesAtZoom(z: number, centerSphericalDeg: ViewCenterSpherical | null, fovPolygon: Point[], viewportSphericalSamples: ViewCenterSpherical[], padding?: number): XYZTileCoord[];
+    tileFromSpherical(zoom: number, sphericalDeg: ViewCenterSpherical): XYZTileCoord;
+    getNeighborTiles(tile: XYZTileCoord, ring?: number): XYZTileCoord[];
+    deduplicateTiles(tiles: XYZTileCoord[]): XYZTileCoord[];
+    private resolveViewCenter;
+    private latToTileY;
+    private wrapTileX;
+    private normalizeLonAround;
+    private clampTileY;
+}
+export {};