@deck.gl/carto 9.0.37 → 9.0.40

package/package.json

@@ -3,7 +3,7 @@
   "description": "CARTO official integration with Deck.gl. Build geospatial applications using CARTO and Deck.gl.",
   "license": "MIT",
   "type": "module",
-  "version": "9.0.37",
+  "version": "9.0.40",
   "publishConfig": {
     "access": "public"
   },
@@ -72,5 +72,5 @@
     "@deck.gl/layers": "^9.0.0",
     "@loaders.gl/core": "^4.2.0"
   },
-  "gitHead": "9ad011cbc6ad627915a4d63c024f426dbbbf646e"
+  "gitHead": "fe6e4763b3dcd5b602291e7732e9d30b0a4eaec1"
 }

package/src/layers/post-process-utils.ts

@@ -1,5 +1,7 @@
 import {Framebuffer, TextureProps} from '@luma.gl/core';
+import type {ShaderPass} from '@luma.gl/shadertools';
 import {
+  _ConstructorOf,
   CompositeLayer,
   Layer,
   LayerContext,
@@ -59,8 +61,10 @@ class DrawCallbackLayer extends Layer {
  * Resulting layer must be used as a sublayer of a layer created
  * with `PostProcessModifier`
  */
-export function RTTModifier(BaseLayer) {
+export function RTTModifier<T extends _ConstructorOf<Layer>>(BaseLayer: T): T {
+  // @ts-expect-error initializeState is abstract
   return class RTTLayer extends BaseLayer {
+    // @ts-expect-error typescript doesn't see static property
     static layerName = `RTT-${BaseLayer.layerName}`;
 
     draw(this: RTTLayer, opts: any) {
@@ -176,5 +180,30 @@ export function PostProcessModifier<T extends Constructor<DrawableCompositeLayer
 
       this.internalState.renderInProgress = false;
     }
+
+    _finalize(): void {
+      this.internalState.renderBuffers.forEach((fbo: Framebuffer) => {
+        fbo.destroy();
+      });
+      this.internalState.renderBuffers = null;
+      this.internalState.postProcess.cleanup();
+    }
   };
 }
+
+const fs = /* glsl */ `\
+vec4 copy_filterColor(vec4 color, vec2 texSize, vec2 texCoord) {
+  return color;
+}
+`;
+
+/**
+ * Copy
+ * Simple module that just copies input color to output
+ */
+export const copy = {
+  name: 'copy',
+  fs,
+  getUniforms: () => ({}),
+  passes: [{filter: true}]
+} as const satisfies ShaderPass<{}>;

package/src/layers/raster-layer-vertex.glsl.ts

@@ -29,12 +29,14 @@ out vec4 position_commonspace;
 
 void main(void) {
   // Rather than positioning using attribute, layout pixel grid using gl_InstanceID
-  vec2 common_position = offset.xy;
+  vec2 tileOrigin = offset.xy;
   float scale = offset.z;
 
   int yIndex = - (gl_InstanceID / BLOCK_WIDTH);
   int xIndex = gl_InstanceID + (yIndex * BLOCK_WIDTH);
-  common_position += scale * vec2(float(xIndex), float(yIndex - 1));
+
+  // Avoid precision issues by applying 0.5 offset here, rather than when laying out vertices
+  vec2 cellCenter = scale * vec2(float(xIndex) + 0.5, float(yIndex) - 0.5);
 
   vec4 color = isStroke ? instanceLineColors : instanceFillColors;
 
@@ -45,7 +47,7 @@ void main(void) {
   // Get position directly from quadbin, rather than projecting
   // Important to set geometry.position before using project_ methods below
   // as geometry.worldPosition is not set (we don't know our lat/long)
-  geometry.position = vec4(common_position, 0.0, 1.0);
+  geometry.position = vec4(tileOrigin + cellCenter, 0.0, 1.0);
   if (project_uProjectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET) {
     geometry.position.xyz -= project_uCommonOrigin;
   }
@@ -69,12 +71,12 @@ void main(void) {
 
   geometry.pickingColor = instancePickingColors;
 
-  // project center of column
-  vec2 offset = (vec2(0.5) + positions.xy * strokeOffsetRatio) * cellWidth * shouldRender;
-  vec3 pos = vec3(offset, project_size(elevation));
-  DECKGL_FILTER_SIZE(pos, geometry);
+  // Cell coordinates centered on origin
+  vec2 base = positions.xy * scale * strokeOffsetRatio * coverage * shouldRender;
+  vec3 cell = vec3(base, project_size(elevation));
+  DECKGL_FILTER_SIZE(cell, geometry);
 
-  geometry.position.xyz += pos;
+  geometry.position.xyz += cell;
   gl_Position = project_common_position_to_clipspace(geometry.position);
 
   geometry.normal = project_normal(normals);

package/src/layers/raster-layer.ts

@@ -12,6 +12,7 @@ import {quadbinToOffset} from './quadbin-utils';
 import {Raster} from './schema/carto-raster-tile-loader';
 import vs from './raster-layer-vertex.glsl';
 import {createBinaryProxy} from '../utils';
+import {RTTModifier} from './post-process-utils';
 
 const defaultProps: DefaultProps<RasterLayerProps> = {
   ...ColumnLayer.defaultProps,
@@ -26,7 +27,8 @@ const defaultProps: DefaultProps<RasterLayerProps> = {
 };
 
 // Modified ColumnLayer with custom vertex shader
-class RasterColumnLayer extends ColumnLayer {
+// Use RTT to avoid inter-tile seams
+class RasterColumnLayer extends RTTModifier(ColumnLayer) {
   static layerName = 'RasterColumnLayer';
 
   getShaders() {
@@ -137,7 +139,18 @@ export default class RasterLayer<DataT = any, ExtraProps = {}> extends Composite
         dataComparator: wrappedDataComparator,
         offset,
         highlightedObjectIndex,
-        highlightColor
+        highlightColor,
+
+        // RTT requires blending otherwise opacity < 1 blends with black
+        // render target
+        parameters: {
+          blendColorSrcFactor: 'one',
+          blendAlphaSrcFactor: 'one',
+          blendColorDstFactor: 'zero',
+          blendAlphaDstFactor: 'zero',
+          blendColorOperation: 'add',
+          blendAlphaOperation: 'add'
+        }
       }
     );
   }

package/src/layers/raster-tile-layer.ts

@@ -1,10 +1,18 @@
-import {CompositeLayer, CompositeLayerProps, DefaultProps, Layer, LayersList} from '@deck.gl/core';
+import {
+  CompositeLayer,
+  CompositeLayerProps,
+  DefaultProps,
+  FilterContext,
+  Layer,
+  LayersList
+} from '@deck.gl/core';
 import RasterLayer, {RasterLayerProps} from './raster-layer';
 import QuadbinTileset2D from './quadbin-tileset-2d';
 import type {TilejsonResult} from '../sources/types';
 import {injectAccessToken, TilejsonPropType} from './utils';
 import {DEFAULT_TILE_SIZE} from '../constants';
 import {TileLayer, TileLayerProps} from '@deck.gl/geo-layers';
+import {copy, PostProcessModifier} from './post-process-utils';
 
 export const renderSubLayers = props => {
   const tileIndex = props.tile?.index?.q;
@@ -14,6 +22,7 @@ export const renderSubLayers = props => {
 
 const defaultProps: DefaultProps<RasterTileLayerProps> = {
   data: TilejsonPropType,
+  refinementStrategy: 'no-overlap',
   tileSize: DEFAULT_TILE_SIZE
 };
 
@@ -27,6 +36,16 @@ type _RasterTileLayerProps<DataT> = Omit<RasterLayerProps<DataT>, 'data'> &
     data: null | TilejsonResult | Promise<TilejsonResult>;
   };
 
+class PostProcessTileLayer extends PostProcessModifier(TileLayer, copy) {
+  filterSubLayer(context: FilterContext) {
+    // Handle DrawCallbackLayer
+    const {tile} = (context.layer as Layer<{tile: any}>).props;
+    if (!tile) return true;
+
+    return super.filterSubLayer(context);
+  }
+}
+
 export default class RasterTileLayer<
   DataT = any,
   ExtraProps extends {} = {}
@@ -42,11 +61,11 @@ export default class RasterTileLayer<
   }
 
   renderLayers(): Layer | null | LayersList {
-    const tileJSON = this.props.data as TilejsonResult;
+    const tileJSON = this.props.data as TilejsonResult & {raster_metadata: any};
     if (!tileJSON) return null;
 
-    const {tiles: data, minzoom: minZoom, maxzoom: maxZoom} = tileJSON;
-    const SubLayerClass = this.getSubLayerClass('tile', TileLayer);
+    const {tiles: data, minzoom: minZoom, maxzoom: maxZoom, raster_metadata: metadata} = tileJSON;
+    const SubLayerClass = this.getSubLayerClass('tile', PostProcessTileLayer);
     return new SubLayerClass(this.props, {
       id: `raster-tile-layer-${this.props.id}`,
       data,
@@ -55,7 +74,10 @@ export default class RasterTileLayer<
       renderSubLayers,
       minZoom,
       maxZoom,
-      loadOptions: this.getLoadOptions()
+      loadOptions: {
+        cartoRasterTile: {metadata},
+        ...this.getLoadOptions()
+      }
     });
   }
 }

package/src/layers/schema/carto-properties-tile-loader.ts

@@ -11,7 +11,7 @@ const CartoPropertiesTileLoader: LoaderWithParser = {
   extensions: ['pbf'],
   mimeTypes: ['application/vnd.carto-properties-tile'],
   category: 'geometry',
-  worker: false,
+  worker: true,
   parse: async (arrayBuffer, options) => parseCartoPropertiesTile(arrayBuffer, options),
   parseSync: parseCartoPropertiesTile,
   options: {}

package/src/layers/schema/carto-raster-tile-loader.ts

@@ -10,12 +10,14 @@ const id = 'cartoRasterTile';
 
 type CartoRasterTileLoaderOptions = LoaderOptions & {
   cartoRasterTile?: {
+    metadata: {compression: 'gzip' | null} | null;
     workerUrl: string;
   };
 };
 
 const DEFAULT_OPTIONS: CartoRasterTileLoaderOptions = {
   cartoRasterTile: {
+    metadata: null,
     workerUrl: getWorkerUrl(id, VERSION)
   }
 };
@@ -48,8 +50,11 @@ function parseCartoRasterTile(
   arrayBuffer: ArrayBuffer,
   options?: CartoRasterTileLoaderOptions
 ): Raster | null {
-  if (!arrayBuffer) return null;
-  const {bands, blockSize} = parsePbf(arrayBuffer, TileReader);
+  const metadata = options?.cartoRasterTile?.metadata;
+  if (!arrayBuffer || !metadata) return null;
+  TileReader.compression = metadata.compression;
+  const out = parsePbf(arrayBuffer, TileReader);
+  const {bands, blockSize} = out;
 
   const numericProps = {};
   for (let i = 0; i < bands.length; i++) {

package/src/layers/schema/carto-raster-tile.ts

@@ -29,12 +29,14 @@ export class BandReader {
         throw Error(`Invalid data type: ${obj.type}`);
       }
       obj.data = {};
-      readPackedTypedArray(TypedArray, pbf, obj.data);
+      const {compression} = TileReader;
+      readPackedTypedArray(TypedArray, pbf, obj.data, {compression});
     }
   }
 }
 
 export class TileReader {
+  public static compression: null | 'gzip';
   static read(pbf, end) {
     return pbf.readFields(TileReader._readField, {blockSize: 0, bands: []}, end);
   }

package/src/layers/schema/fast-pbf.ts

@@ -1,7 +1,22 @@
+import {GZipCompression} from '@loaders.gl/compression';
+
+type ReadPackedOptions = {
+  compression: null | 'gzip';
+};
+
 // Optimized (100X speed improvement) reading function for binary data
-export function readPackedTypedArray(TypedArray, pbf, obj) {
+export function readPackedTypedArray(TypedArray, pbf, obj, options?: ReadPackedOptions) {
   const end = pbf.type === 2 ? pbf.readVarint() + pbf.pos : pbf.pos + 1;
-  obj.value = new TypedArray(pbf.buf.buffer.slice(pbf.pos, end));
+  const data = pbf.buf.buffer.slice(pbf.pos, end);
+
+  if (options?.compression === 'gzip') {
+    const compression = new GZipCompression();
+    const decompressedData = compression.decompressSync(data);
+    obj.value = new TypedArray(decompressedData);
+  } else {
+    obj.value = new TypedArray(data);
+  }
+
   pbf.pos = end;
   return obj.value;
 }