@deck.gl/extensions 9.3.7 → 9.4.0-alpha.1

package/package.json

@@ -3,7 +3,7 @@
   "description": "Plug-and-play functionalities for deck.gl layers",
   "license": "MIT",
   "type": "module",
-  "version": "9.3.7",
+  "version": "9.4.0-alpha.1",
   "publishConfig": {
     "access": "public"
   },
@@ -43,9 +43,9 @@
     "@math.gl/core": "^4.1.0"
   },
   "peerDependencies": {
-    "@deck.gl/core": "~9.3.0",
+    "@deck.gl/core": "~9.3.0-beta.2",
     "@luma.gl/core": "~9.3.3",
     "@luma.gl/engine": "~9.3.3"
   },
-  "gitHead": "ac8cd3dd7a70b1f1471729425d63fcff38dc0a13"
+  "gitHead": "a30177af4ec82fd612d116d1528deac09f1800b4"
 }

package/src/terrain/height-map-builder.ts

@@ -3,9 +3,17 @@
 // Copyright (c) vis.gl contributors
 
 import {Device, Framebuffer} from '@luma.gl/core';
-import {joinLayerBounds, getRenderBounds, makeViewport, Bounds} from '../utils/projection-utils';
+import {
+  joinLayerBounds,
+  getRenderBounds,
+  makeViewport,
+  getMercatorReferenceViewport,
+  lngLatToMercatorCommon,
+  Bounds
+} from '../utils/projection-utils';
 import {createRenderTarget} from './utils';
 
+import {_GlobeViewport as GlobeViewport} from '@deck.gl/core';
 import type {Viewport, Layer} from '@deck.gl/core';
 
 const MAP_MAX_SIZE = 2048;
@@ -72,10 +80,10 @@ export class HeightMapBuilder {
       );
 
     if (layersChanged) {
-      // Recalculate cached bounds
+      // Recalculate cached bounds in absolute Mercator common space
       this.layers = layers;
       this.layersBounds = layers.map(layer => layer.getBounds());
-      this.layersBoundsCommon = joinLayerBounds(layers, viewport);
+      this.layersBoundsCommon = joinLayerBounds(layers, getMercatorReferenceViewport(viewport));
     }
 
     const viewportChanged = !this.lastViewport || !viewport.equals(this.lastViewport);
@@ -83,7 +91,11 @@ export class HeightMapBuilder {
     if (!this.layersBoundsCommon) {
       this.renderViewport = null;
     } else if (layersChanged || viewportChanged) {
-      const bounds = getRenderBounds(this.layersBoundsCommon, viewport);
+      // On GlobeView, viewport bounds are sphere cartesian — skip intersection
+      const bounds =
+        viewport instanceof GlobeViewport
+          ? this.layersBoundsCommon
+          : getRenderBounds(this.layersBoundsCommon, viewport);
       if (bounds[2] <= bounds[0] || bounds[3] <= bounds[1]) {
         this.renderViewport = null;
         return false;
@@ -96,6 +108,14 @@ export class HeightMapBuilder {
       const pixelWidth = (bounds[2] - bounds[0]) * scale;
       const pixelHeight = (bounds[3] - bounds[1]) * scale;
 
+      // Use Mercator center — viewport.center on GlobeView is sphere cartesian
+      const centerMerc = viewport.isGeospatial
+        ? lngLatToMercatorCommon([
+            (viewport as {longitude?: number}).longitude ?? 0,
+            (viewport as {latitude?: number}).latitude ?? 0
+          ])
+        : [viewport.center[0], viewport.center[1]];
+
       this.renderViewport =
         pixelWidth > 0 || pixelHeight > 0
           ? makeViewport({
@@ -103,12 +123,7 @@ export class HeightMapBuilder {
               // vertices will not use the standard project_to_clipspace in the DRAW_TO_HEIGHT_MAP shader
               // However the viewport must have the same center and zoom as the screen viewport
               // So that projection uniforms used for calculating z are the same
-              bounds: [
-                viewport.center[0] - 1,
-                viewport.center[1] - 1,
-                viewport.center[0] + 1,
-                viewport.center[1] + 1
-              ],
+              bounds: [centerMerc[0] - 1, centerMerc[1] - 1, centerMerc[0] + 1, centerMerc[1] + 1],
               zoom: viewport.zoom,
               width: Math.min(pixelWidth, MAP_MAX_SIZE),
               height: Math.min(pixelHeight, MAP_MAX_SIZE),

package/src/terrain/shader-module.ts

@@ -67,10 +67,21 @@ uniform sampler2D terrain_map;
 export const terrainModule = {
   name: 'terrain',
   dependencies: [project],
-  // eslint-disable-next-line prefer-template
-  vs: uniformBlock + /* glsl */ 'out vec3 commonPos;',
-  // eslint-disable-next-line prefer-template
-  fs: uniformBlock + /* glsl */ 'in vec3 commonPos;',
+  vs: `${uniformBlock}
+out vec3 commonPos;
+// In globe mode, absolute Mercator position for terrain FBO UV lookups
+out vec2 terrainMercPos;
+out float terrainHeight;
+
+vec2 terrain_globe_to_mercator(vec3 globePosition) {
+  float D = length(globePosition);
+  float sinLat = clamp(globePosition.z / D, -0.999998, 0.999998);
+  float x = atan(globePosition.x, -globePosition.y);
+  float y = atanh(sinLat);
+  return (vec2(x, y) + PI) * WORLD_SCALE;
+}
+`,
+  fs: `${uniformBlock}in vec2 terrainMercPos;\nin float terrainHeight;`,
   inject: {
     'vs:#main-start': /* glsl */ `
 if (terrain.mode == TERRAIN_MODE_SKIP) {
@@ -80,32 +91,48 @@ if (terrain.mode == TERRAIN_MODE_SKIP) {
 `,
     'vs:DECKGL_FILTER_GL_POSITION': /* glsl */ `
 commonPos = geometry.position.xyz;
+terrainHeight = commonPos.z + project.commonOrigin.z;
+if (project.projectionMode == PROJECTION_MODE_GLOBE) {
+  terrainMercPos = terrain_globe_to_mercator(commonPos);
+  terrainHeight = length(commonPos) - GLOBE_RADIUS;
+} else {
+  terrainMercPos = commonPos.xy;
+}
 if (terrain.mode == TERRAIN_MODE_WRITE_HEIGHT_MAP) {
-  vec2 texCoords = (commonPos.xy - terrain.bounds.xy) / terrain.bounds.zw;
+  vec2 texCoords = (terrainMercPos - terrain.bounds.xy) / terrain.bounds.zw;
   position = vec4(texCoords * 2.0 - 1.0, 0.0, 1.0);
-  commonPos.z += project.commonOrigin.z;
 }
 if (terrain.mode == TERRAIN_MODE_USE_HEIGHT_MAP) {
   vec3 anchor = geometry.worldPosition;
   anchor.z = 0.0;
   vec3 anchorCommon = project_position(anchor);
-  vec2 texCoords = (anchorCommon.xy - terrain.bounds.xy) / terrain.bounds.zw;
+  vec2 anchorMercPos = project.projectionMode == PROJECTION_MODE_GLOBE
+    ? terrain_globe_to_mercator(anchorCommon)
+    : anchorCommon.xy;
+  vec2 texCoords = (anchorMercPos - terrain.bounds.xy) / terrain.bounds.zw;
   if (texCoords.x >= 0.0 && texCoords.y >= 0.0 && texCoords.x <= 1.0 && texCoords.y <= 1.0) {
     float terrainZ = texture(terrain_map, texCoords).r;
-    geometry.position.z += terrainZ;
+    if (project.projectionMode == PROJECTION_MODE_GLOBE) {
+      // Height map is written in Mercator common space (units = TILE_SIZE / EARTH_CIRCUMFERENCE / cos(lat))
+      // Convert to globe radial units (units = GLOBE_RADIUS / EARTH_RADIUS)
+      terrainZ *= cos(radians(geometry.worldPosition.y)) * PI;
+      geometry.position.xyz += normalize(geometry.position.xyz) * terrainZ;
+    } else {
+      geometry.position.z += terrainZ;
+    }
     position = project_common_position_to_clipspace(geometry.position);
   }
 }
     `,
     'fs:#main-start': /* glsl */ `
 if (terrain.mode == TERRAIN_MODE_WRITE_HEIGHT_MAP) {
-  fragColor = vec4(commonPos.z, 0.0, 0.0, 1.0);
+  fragColor = vec4(terrainHeight, 0.0, 0.0, 1.0);
   return;
 }
     `,
     'fs:DECKGL_FILTER_COLOR': /* glsl */ `
 if ((terrain.mode == TERRAIN_MODE_USE_COVER) || (terrain.mode == TERRAIN_MODE_USE_COVER_ONLY)) {
-  vec2 texCoords = (commonPos.xy - terrain.bounds.xy) / terrain.bounds.zw;
+  vec2 texCoords = (terrainMercPos - terrain.bounds.xy) / terrain.bounds.zw;
   vec4 pixel = texture(terrain_map, texCoords);
   if (terrain.mode == TERRAIN_MODE_USE_COVER_ONLY) {
     color = pixel;
@@ -173,7 +200,7 @@ if ((terrain.mode == TERRAIN_MODE_USE_COVER) || (terrain.mode == TERRAIN_MODE_US
       return {
         mode,
         terrain_map: sampler,
-        // Convert bounds to the common space, as [minX, minY, width, height]
+        // Convert bounds to common space, as [minX, minY, width, height]
         bounds: bounds
           ? [
               bounds[0] - commonOrigin[0],

package/src/terrain/terrain-cover.ts

@@ -4,10 +4,18 @@
 
 import {Framebuffer} from '@luma.gl/core';
 
+import {_GlobeViewport as GlobeViewport} from '@deck.gl/core';
 import type {Layer, Viewport} from '@deck.gl/core';
 
 import {createRenderTarget} from './utils';
-import {joinLayerBounds, makeViewport, getRenderBounds, Bounds} from '../utils/projection-utils';
+import {
+  getMercatorReferenceViewport,
+  joinLayerBounds,
+  lngLatToMercatorCommon,
+  makeViewport,
+  getRenderBounds,
+  Bounds
+} from '../utils/projection-utils';
 
 type TileHeader = {
   boundingBox: [min: number[], max: number[]];
@@ -113,13 +121,14 @@ export class TerrainCover {
     const targetLayer = this.targetLayer;
     let shouldRedraw = false;
 
+    // Bounds in absolute Mercator common space (matches terrain cover FBO viewport)
     if (this.tile && 'boundingBox' in this.tile) {
       if (!this.targetBounds) {
         shouldRedraw = true;
         this.targetBounds = this.tile.boundingBox;
 
-        const bottomLeftCommon = viewport.projectPosition(this.targetBounds[0]);
-        const topRightCommon = viewport.projectPosition(this.targetBounds[1]);
+        const bottomLeftCommon = lngLatToMercatorCommon(this.targetBounds[0]);
+        const topRightCommon = lngLatToMercatorCommon(this.targetBounds[1]);
         this.targetBoundsCommon = [
           bottomLeftCommon[0],
           bottomLeftCommon[1],
@@ -131,7 +140,10 @@ export class TerrainCover {
       // console.log('bounds changed', this.bounds, '>>', newBounds);
       shouldRedraw = true;
       this.targetBounds = targetLayer.getBounds();
-      this.targetBoundsCommon = joinLayerBounds([targetLayer], viewport);
+      this.targetBoundsCommon = joinLayerBounds(
+        [targetLayer],
+        getMercatorReferenceViewport(viewport)
+      );
     }
 
     if (!this.targetBoundsCommon) {
@@ -146,7 +158,11 @@ export class TerrainCover {
     } else {
       const oldZoom = this.renderViewport?.zoom;
       shouldRedraw = shouldRedraw || newZoom !== oldZoom;
-      const newBounds = getRenderBounds(this.targetBoundsCommon, viewport);
+      // On GlobeView, viewport bounds are sphere cartesian — skip intersection
+      const newBounds =
+        viewport instanceof GlobeViewport
+          ? this.targetBoundsCommon
+          : getRenderBounds(this.targetBoundsCommon, viewport);
       const oldBounds = this.bounds;
       shouldRedraw = shouldRedraw || !oldBounds || newBounds.some((x, i) => x !== oldBounds[i]);
       this.bounds = newBounds;

package/src/utils/projection-utils.ts

@@ -8,6 +8,26 @@ import type {Layer, Viewport} from '@deck.gl/core';
 /** Bounds in CARTESIAN coordinates */
 export type Bounds = [minX: number, minY: number, maxX: number, maxY: number];
 
+/** Fixed Mercator viewport for projection-independent coordinate conversion */
+const MERCATOR_REFERENCE_VIEWPORT = new WebMercatorViewport({
+  width: 1,
+  height: 1,
+  longitude: 0,
+  latitude: 0,
+  zoom: 0
+});
+
+/** Project lng/lat to absolute Mercator common space. */
+export function lngLatToMercatorCommon(lngLat: number[]): [number, number] {
+  const [x, y] = MERCATOR_REFERENCE_VIEWPORT.projectPosition(lngLat);
+  return [x, y];
+}
+
+/** Returns a Mercator viewport for bounds computation, bypassing GlobeView. */
+export function getMercatorReferenceViewport(viewport: Viewport): Viewport {
+  return viewport.isGeospatial ? MERCATOR_REFERENCE_VIEWPORT : viewport;
+}
+
 /*
  * Compute the union of bounds from multiple layers
  * Returns bounds in CARTESIAN coordinates
@@ -63,11 +83,14 @@ export function makeViewport(opts: {
     return null;
   }
 
-  const centerWorld = viewport.unprojectPosition([
-    (bounds[0] + bounds[2]) / 2,
-    (bounds[1] + bounds[3]) / 2,
-    0
-  ]);
+  // Unproject through Mercator reference (GlobeView would give sphere coords)
+  const centerWorld = isGeospatial
+    ? MERCATOR_REFERENCE_VIEWPORT.unprojectPosition([
+        (bounds[0] + bounds[2]) / 2,
+        (bounds[1] + bounds[3]) / 2,
+        0
+      ])
+    : viewport.unprojectPosition([(bounds[0] + bounds[2]) / 2, (bounds[1] + bounds[3]) / 2, 0]);
 
   let {width, height, zoom} = opts;
   if (zoom === undefined) {