added(display): camera now always stays above terrain, preventing users from zooming below ground with smooth adaptive clamping

added(display): auto-adjust camera zoom to maintain altitude above terrain when terrain data becomes available

prepare TerrainWorker integration and updates in TerrainTileProvider

Signed-off-by: Tim Deubler <[email protected]>

Author: TerminalTim

packages/core/src/features/TerrainFeature.ts

@@ -18,17 +18,18 @@
  */
 import {Feature} from './Feature';
 import {GeoJSONCoordinate} from './GeoJSON';
+import {TerrainTileProvider, TileLayer} from '@here/xyz-maps-core';
 
 
 export type TerrainTileMesh = {
-    vertices: Uint16Array|Uint32Array|Float32Array;
-    indices: Uint16Array|Uint32Array;
-    normals?: Int8Array|Int16Array|Float32Array;
+    vertices: Uint16Array | Uint32Array | Float32Array;
+    indices: Uint16Array | Uint32Array;
+    normals?: Int8Array | Int16Array | Float32Array;
     edgeIndices?: {
-        left: Uint16Array|Uint32Array;
-        right: Uint16Array|Uint32Array;
-        top: Uint16Array|Uint32Array;
-        bottom: Uint16Array|Uint32Array;
+        left: Uint16Array | Uint32Array;
+        right: Uint16Array | Uint32Array;
+        top: Uint16Array | Uint32Array;
+        bottom: Uint16Array | Uint32Array;
     }
 }
 
@@ -51,6 +52,8 @@ export type TerrainTileFeatureProperties = TerrainTileMesh & {
  * This Feature represents a Terrain Tile.
  */
 export class TerrainTileFeature extends Feature<'Polygon'> {
+    _provider: TerrainTileProvider;
+
     /**
      * The Properties of the Terrain Tile feature.
      */
@@ -64,4 +67,39 @@ export class TerrainTileFeature extends Feature<'Polygon'> {
         type: 'Polygon',
         coordinates: GeoJSONCoordinate[][]
     };
+
+
+    /**
+     * @hidden
+     * @internal
+     *
+     * Returns the height map array for the terrain tile.
+     * The height map contains elevation data for each point in the tile.
+     *
+     * @returns {Uint16Array | Uint32Array | Float32Array | null}
+     *          The height map array, or null if not available.
+     */
+    getHeightMap(): Uint16Array | Uint32Array | Float32Array | null {
+        return this.properties.heightMap || null;
+    }
+
+    /**
+     * @hidden
+     * @internal
+     *
+     * Returns the height value from the height map at the given normalized local tile coordinates.
+     *
+     * @param normalizedX - The normalized X coordinate (0.0 to 1.0).
+     * @param nomralizedY - The normalized Y coordinate (0.0 to 1.0).
+     *
+     * @returns The height value at the specified coordinates, or null if no height map is available.
+     */
+    getHeightAt(normalizedX: number, nomralizedY: number, interpolate?: boolean = false) {
+        const heightMap = this.getHeightMap();
+        if (!heightMap) return null;
+        const size = Math.sqrt(heightMap.length);
+        const x = Math.floor(normalizedX * size);
+        const y = Math.floor(nomralizedY * size);
+        return heightMap[y * size + x];
+    }
 }

packages/core/src/layers/terrain/TerrainStyle.ts

@@ -153,6 +153,7 @@ export class TerrainTileLayerStyle implements LayerStyle {
                             };
                         }
                         return {
+                            id: `Terrain-${id}-${Math.random()*1e6^0}`,
                             textures,
                             materials: {
                                 terrain: {

packages/core/src/loaders/webworker/HTTPLoader.ts

@@ -28,10 +28,13 @@ import Tile from '../../tile/Tile';
 //     return worker;
 // };
 
+type TileResponse = { tile: Tile, success: any, error: any };
+type CustomResponse = { resolve: (data: unknown) => void, reject(reason?: any): void };
+
 class WorkerHTTPLoader extends HTTPLoader {
     private worker: Worker;
 
-    private requests: Map<string, { tile: Tile, success: any, error: any }> = new Map();
+    private pendingResponses: Map<string, TileResponse | CustomResponse> = new Map();
 
     constructor(worker: string, options: HTTPLoaderOptions, payload?) {
         super(options);
@@ -56,19 +59,22 @@ class WorkerHTTPLoader extends HTTPLoader {
     private receiveMessage(e) {
         const data = e.data;
         const msg = data.msg;
-        const quadkey = data.quadkey;
-        const cb = this.requests.get(quadkey);
-
+        const key = data.key || msg;
+        const cb = this.pendingResponses.get(key);
         if (cb) {
-            this.requests.delete(quadkey);
+            this.pendingResponses.delete(key);
             switch (msg) {
             case 'success':
-                cb.success(this.processData(data.data));
+                (cb as TileResponse).success(this.processData(data.data));
                 break;
             case 'error':
                 const {tile} = cb;
                 tile.error = new NetworkError(data.data);
-                cb.error?.(tile.error, tile);
+                (cb as TileResponse).error?.(tile.error, tile);
+                break;
+            default:
+                // custom messages
+                (cb as CustomResponse).resolve(data.data);
                 break;
             }
         }
@@ -78,7 +84,7 @@ class WorkerHTTPLoader extends HTTPLoader {
     load(tile, success, error?) {
         const url = this.getUrl(tile);
         const {quadkey, x, y, z} = tile;
-        this.requests.set(quadkey, {tile, success, error});
+        this.pendingResponses.set(quadkey, {tile, success, error});
         this.worker.postMessage({msg: 'load', url, quadkey, x, y, z});
     }
 
@@ -87,11 +93,26 @@ class WorkerHTTPLoader extends HTTPLoader {
         const url = this.getUrl(tile);
         const {quadkey, x, y, z} = tile;
 
-        if (this.requests.get(quadkey)) {
-            this.requests.delete(quadkey);
+        if (this.pendingResponses.get(quadkey)) {
+            this.pendingResponses.delete(quadkey);
             this.worker.postMessage({msg: 'abort', url, quadkey, x, y, z});
         }
     }
+
+
+    private addPendingResponse(key: string) {
+        return new Promise(async (resolve, reject) => {
+            this.pendingResponses.set(key, {resolve, reject});
+        });
+    }
+
+    async call(args: { method: string, key?: string, data?: any, transfer?: any[] }): Promise<any> {
+        const {method, data, transfer} = args;
+        const key = args.method + args.key ?? '';
+        const promise = this.addPendingResponse(key);
+        this.worker.postMessage({msg: method, key, custom: data}, transfer);
+        return promise;
+    }
 }
 
 export default WorkerHTTPLoader;

packages/core/src/loaders/webworker/HTTPWorker.ts

@@ -26,11 +26,14 @@ export class HTTPWorker {
     loader;
 
     id: string;
+    private customHandlers: Set<string>;
 
     constructor(options: HTTPLoaderOptions) {
         const {responseType} = options;
         const loader = this.loader = new HTTPLoader({responseType});
 
+        this.customHandlers = new Set<string>();
+
         self.addEventListener('message', (e) => {
             const {msg, quadkey, url, x, y, z} = e.data;
             switch (msg) {
@@ -40,23 +43,37 @@ export class HTTPWorker {
             case 'load':
                 loader.baseUrl = url;
                 this.load(x, y, z, quadkey, url);
+                break;
+            default:
+                if (this.customHandlers.has(msg)) {
+                    const result : {data:any, transfer?: Transferable[]} = this[msg](e.data.custom);
+                    if (result?.data) {
+                        self.postMessage({msg, key: e.data.key, data: result.data}, result.transfer);
+                    }
+                }
             }
         });
     }
 
+    protected registerCustomMsgHandler(customHandler: string) {
+        if (typeof this[customHandler] == 'function') {
+            this.customHandlers.add(customHandler);
+        }
+    }
+
     load(x: number, y: number, z: number, quadkey: string, url: string) {
         const worker = this;
         worker.loader.load({quadkey}, (arrayBuffer) => {
             const {data, transfer} = worker.process(arrayBuffer, x, y, z);
             self.postMessage({
                 msg: 'success',
                 url,
-                quadkey,
+                key: quadkey,
                 data
             }, transfer);
         },
         (e) => {
-            self.postMessage({msg: 'error', url, quadkey, data: e});
+            self.postMessage({msg: 'error', url, key: quadkey, data: e});
         });
     }
 

packages/core/src/providers/TerrainProvider/RTINMeshBuilder.ts

@@ -262,8 +262,6 @@ export class RTINMeshBuilder {
         const maxXY = this.size - 1;
         const meshIndices: Uint32Array | Uint16Array = this.meshIndices;
 
-        console.log('---');
-
         this.resetTmpMesh();
 
         const processTriangle = (ax: number, ay: number, bx: number, by: number, cx: number, cy: number) => {

packages/core/src/providers/TerrainProvider/TerrainTileProvider.ts

@@ -41,21 +41,30 @@ type TerrainTileProviderOptions = Omit<RemoteTileProviderOptions, 'level'> & {
     loader?: any;
 }
 
+
+const createGeometricErrorMap = (maxGeometricError: number | StyleZoomRange<number>) => {
+    if (typeof maxGeometricError == 'number') {
+        maxGeometricError = Object.fromEntries(
+            Array.from({length: 30}, (_, i) => [i, maxGeometricError as number])
+        );
+    }
+    return maxGeometricError;
+};
+
+
 export class TerrainTileProvider extends RemoteTileProvider {
     dataType = 'json';
 
     Feature = TerrainTileFeature;
+    private _twl: TerrainWorkerLoader; // TerrainWorkerLoader
+
+    private maxGeometricError: { [zoom: number]: number };
+
     constructor(options: TerrainTileProviderOptions) {
         options ||= {};
 
-        const attribution: (DataSourceAttribution|string)[] = [];
-        let {maxGeometricError} = options;
-
-        if (typeof maxGeometricError == 'number') {
-            maxGeometricError = Object.fromEntries(
-                Array.from({length: 30}, (_, i) => [i, maxGeometricError as number])
-            );
-        }
+        const attribution: (DataSourceAttribution | string)[] = [];
+        const maxGeometricError = createGeometricErrorMap(options.maxGeometricError);
 
         const addAttribution = (attr: string | DataSourceAttribution | DataSourceAttribution[]) => {
             if (attr) {
@@ -65,6 +74,9 @@ export class TerrainTileProvider extends RemoteTileProvider {
 
         addAttribution(options.attribution);
 
+
+        let terrainWorkderLoader;
+
         if (!options.loader) {
             const tileLoadersConfig = {};
             for (let key of ['terrain', 'imagery']) {
@@ -79,6 +91,9 @@ export class TerrainTileProvider extends RemoteTileProvider {
                         ...loaderOptions,
                         maxGeometricError
                     });
+                    if (key == 'terrain') {
+                        terrainWorkderLoader = tileLoadersConfig[key];
+                    }
                     addAttribution(loaderOptions.attribution);
                 }
             }
@@ -97,6 +112,8 @@ export class TerrainTileProvider extends RemoteTileProvider {
 
         const provider = this;
 
+        this._twl = terrainWorkderLoader;
+
         this.remoteTileLoader = new TileLoadDelegator({
             provider,
             loader: options.loader,
@@ -146,7 +163,8 @@ export class TerrainTileProvider extends RemoteTileProvider {
                     const oppositeSide = getOppositeNeighbor(side);
                     updatedTiles.push(neighborTile);
 
-                    if (heightMap) {
+                    if (!properties.edgeIndices) {
+                        // fully uses heightmaps
                         const neighborHeightMap = neighborProperties.heightMap;
                         if (side === Neighbor.RIGHT || side === Neighbor.BOTTOM) {
                             stitchHeightmapBorders(heightMap, neighborHeightMap, side, 1, 2);