Add linz-elevation-prod into dropdown

linz · Aug 7, 2024 · fd0d204 · fd0d204
1 parent 0fafb18
commit fd0d204
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 43 deletions.
diff --git a/packages/landing/src/components/debug.tsx b/packages/landing/src/components/debug.tsx
@@ -30,7 +30,7 @@ const HillShadeLayerId = 'debug-hillshade';
 /** dynamic hillshade sources are prefixed with this key */
 const HillShadePrefix = '__hillshade-';
 /** dynamic linz-elevation source key */
-const elevationPrefixedId = '__terrain-linz-elevation';
+const elevationProdId = 'linz-elevation-prod';
 
 interface DropDownContext {
   /** Label for the drop down */
@@ -170,13 +170,6 @@ export class Debug extends Component<{ map: maplibregl.Map }, DebugState> {
     this.setVectorShown(target.checked, debugTypes['capture-area']);
   };
 
-  /** Show LINZ Elevation Terrain on the map */
-  toggleElevation: ChangeEventHandler = (e) => {
-    const target = e.target as HTMLInputElement;
-    const sourceId = target.checked ? elevationPrefixedId : null;
-    this.setTerrainShown(sourceId);
-  };
-
   _loadingConfig: Promise<void> = Promise.resolve();
   async loadConfig(): Promise<void> {
     const tileSetId = Config.map.layerId;
@@ -233,7 +226,6 @@ export class Debug extends Component<{ map: maplibregl.Map }, DebugState> {
         {this.renderCogToggle()}
         {this.renderSourceToggle()}
         {this.renderCaptureAreaToggle()}
-        {this.renderElevationToggle()}
         {this.renderTileToggle()}
         {this.renderRasterSourceDropdown()}
         {this.renderDemSourceDropdown(demSources)}
@@ -360,26 +352,33 @@ export class Debug extends Component<{ map: maplibregl.Map }, DebugState> {
     });
   }
 
+  /**
+   * Add a terrain source that points to production elevation data for debug
+   */
+  ensureElevationProd(): void {
+    const map = this.props.map;
+    // Enable default linz-elevation terrain
+    if (map.getSource(elevationProdId) == null) {
+      const url = WindowUrl.toTileUrl({
+        urlType: MapOptionType.TileRaster,
+        tileMatrix: Config.map.tileMatrix,
+        layerId: 'elevation',
+        pipeline: 'terrain-rgb',
+        imageFormat: 'png',
+      });
+      map.addSource(elevationProdId, {
+        type: 'raster-dem',
+        tiles: [url],
+        tileSize: 256,
+      });
+    }
+  }
+
   setTerrainShown(sourceId: string | null): void {
+    this.ensureElevationProd();
+    // Avoid to set debug.terrain for dynamic source, this will return null from the getStyle API with random terrain parameter
     Config.map.setDebug('debug.terrain', sourceId);
     const map = this.props.map;
-    if (sourceId === elevationPrefixedId) {
-      // Enable default linz-elevation terrain
-      if (map.getSource(sourceId) == null) {
-        const url = WindowUrl.toTileUrl({
-          urlType: MapOptionType.TileRaster,
-          tileMatrix: Config.map.tileMatrix,
-          layerId: 'elevation',
-          pipeline: 'terrain-rgb',
-          imageFormat: 'png',
-        });
-        map.addSource(sourceId, {
-          type: 'raster-dem',
-          tiles: [url],
-          tileSize: 256,
-        });
-      }
-    }
 
     const isTurnOff = sourceId === 'off' || sourceId == null;
     const currentTerrain = map.getTerrain();
@@ -480,26 +479,11 @@ export class Debug extends Component<{ map: maplibregl.Map }, DebugState> {
     );
   }
 
-  renderElevationToggle(): ReactNode {
-    return (
-      <Fragment>
-        <div className="debug__info">
-          <label className="debug__label">LINZ Elevation</label>
-          <input
-            type="checkbox"
-            onChange={this.toggleElevation}
-            checked={Config.map.debug['debug.terrain'] === elevationPrefixedId}
-          />
-        </div>
-      </Fragment>
-    );
-  }
-
   getSourcesIds(type: string): string[] {
     const style = this.props.map.getStyle();
     if (type === 'raster-dem') {
       return Object.keys(style.sources).filter(
-        (id) => !id.startsWith(HillShadePrefix) && id !== elevationPrefixedId && style.sources[id].type === type,
+        (id) => !id.startsWith(HillShadePrefix) && style.sources[id].type === type,
       );
     } else if (type === 'raster') {
       return Object.keys(style.sources).filter((id) => id.startsWith('basemaps') && style.sources[id].type === type);

diff --git a/packages/landing/src/config.map.ts b/packages/landing/src/config.map.ts
@@ -154,7 +154,8 @@ export class MapConfig extends Emitter<MapConfigEvents> {
     if (opts.tileMatrix.identifier !== GoogleTms.identifier) urlParams.append('tileMatrix', opts.tileMatrix.identifier);
     // Config by far the longest so make it the last parameter
     if (opts.config) urlParams.append('config', ensureBase58(opts.config));
-    if (opts.terrain) urlParams.append('terrain', opts.terrain);
+    // We don't need to set terrain parameter for debug, as we got debug.terrain parameter to replace
+    if (opts.terrain && !opts.isDebug) urlParams.append('terrain', opts.terrain);
 
     ConfigDebug.toUrl(opts.debug, urlParams);
     return urlParams.toString();