@deck.gl/carto 9.0.26 → 9.0.28

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.26",
+  "version": "9.0.28",
   "publishConfig": {
     "access": "public"
   },
@@ -72,5 +72,5 @@
     "@deck.gl/layers": "^9.0.0",
     "@loaders.gl/core": "^4.2.0"
   },
-  "gitHead": "207f67da86ca13e92eee6b96a934b76f92926d4c"
+  "gitHead": "58a2526b9b910d3ce086d627643839c3cd8ee944"
 }

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

@@ -122,26 +122,33 @@ class ClusterGeoJsonLayer<
 
     const properties = extractAggregationProperties(visibleTiles[0]);
     const data = [] as ClusteredFeaturePropertiesT<FeaturePropertiesT>[];
+    let needsUpdate = false;
     for (const tile of visibleTiles) {
       // Calculate aggregation based on viewport zoom
       const overZoom = Math.round(zoom - tile.zoom);
       const aggregationLevels = Math.round(clusterLevel) - overZoom;
-      aggregateTile(tile, aggregationLevels, properties, getPosition, getWeight);
+      const didAggregate = aggregateTile(
+        tile,
+        aggregationLevels,
+        properties,
+        getPosition,
+        getWeight
+      );
+      needsUpdate ||= didAggregate;
       data.push(...tile.userData![aggregationLevels]);
     }
 
     data.sort((a, b) => Number(b.count - a.count));
 
     const clusterIds = data?.map((tile: any) => tile.id);
-    const needsUpdate = !deepEqual(clusterIds, this.state.clusterIds, 1);
+    needsUpdate ||= !deepEqual(clusterIds, this.state.clusterIds, 1);
     this.setState({clusterIds});
 
     if (needsUpdate) {
       const stats = computeAggregationStats(data, properties);
-      for (const d of data) {
-        d.stats = stats;
-      }
-      this.setState({data: clustersToBinary(data)});
+      const binaryData = clustersToBinary(data);
+      binaryData.points.attributes = {stats};
+      this.setState({data: binaryData});
     }
 
     const props = {

package/src/layers/cluster-utils.ts

@@ -1,6 +1,6 @@
 import {cellToParent} from 'quadbin';
 import {_Tile2DHeader as Tile2DHeader} from '@deck.gl/geo-layers';
-import {Accessor} from '@deck.gl/core';
+import {Accessor, log} from '@deck.gl/core';
 import {BinaryFeatureCollection} from '@loaders.gl/schema';
 
 export type Aggregation = 'any' | 'average' | 'count' | 'min' | 'max' | 'sum';
@@ -12,23 +12,37 @@ export type ClusteredFeaturePropertiesT<FeaturePropertiesT> = FeaturePropertiesT
   id: bigint;
   count: number;
   position: [number, number];
-  stats: Record<keyof FeaturePropertiesT, {min: number; max: number}>;
 };
 export type ParsedQuadbinCell<FeaturePropertiesT> = {id: bigint; properties: FeaturePropertiesT};
 export type ParsedQuadbinTile<FeaturePropertiesT> = ParsedQuadbinCell<FeaturePropertiesT>[];
 
+/**
+ * Aggregates tile by specified properties, caching result in tile.userData
+ *
+ * @returns true if data was aggregated, false if cache used
+ */
 export function aggregateTile<FeaturePropertiesT>(
   tile: Tile2DHeader<ParsedQuadbinTile<FeaturePropertiesT>>,
   aggregationLevels: number,
   properties: AggregationProperties<FeaturePropertiesT> = [],
   getPosition: Accessor<ParsedQuadbinCell<FeaturePropertiesT>, [number, number]>,
   getWeight: Accessor<ParsedQuadbinCell<FeaturePropertiesT>, number>
-): void {
-  if (!tile.content) return;
+): boolean {
+  if (!tile.content) return false;
 
   // Aggregate on demand and cache result
   if (!tile.userData) tile.userData = {};
-  if (tile.userData[aggregationLevels]) return;
+  const cell0 = tile.userData[aggregationLevels]?.[0];
+  if (cell0) {
+    // Have already aggregated this tile
+    if (properties.every(property => property.name in cell0)) {
+      // Use cached result
+      return false;
+    }
+
+    // Aggregated properties have changed, re-aggregate
+    tile.userData = {};
+  }
 
   const out: Record<number, any> = {};
   for (const cell of tile.content) {
@@ -80,6 +94,7 @@ export function aggregateTile<FeaturePropertiesT>(
   }
 
   tile.userData[aggregationLevels] = Object.values(out);
+  return true;
 }
 
 export function extractAggregationProperties<FeaturePropertiesT extends {}>(
@@ -90,6 +105,7 @@ export function extractAggregationProperties<FeaturePropertiesT extends {}>(
   for (const name of Object.keys(tile.content![0].properties)) {
     let aggregation = name.split('_').pop()!.toLowerCase() as Aggregation;
     if (!validAggregations.includes(aggregation)) {
+      log.warn(`No valid aggregation present in ${name} property`)();
       aggregation = 'any';
     }
     properties.push({name: name as keyof FeaturePropertiesT, aggregation});
@@ -125,9 +141,20 @@ const EMPTY_BINARY_PROPS = {
   globalFeatureIds: {value: EMPTY_UINT16ARRAY, size: 1}
 };
 
+type BinaryFeatureCollectionWithStats<FeaturePropertiesT> = Omit<
+  BinaryFeatureCollection,
+  'points'
+> & {
+  points: BinaryFeatureCollection['points'] & {
+    attributes?: {
+      stats: Record<keyof FeaturePropertiesT, {min: number; max: number}>;
+    };
+  };
+};
+
 export function clustersToBinary<FeaturePropertiesT>(
   data: ClusteredFeaturePropertiesT<FeaturePropertiesT>[]
-): BinaryFeatureCollection {
+): BinaryFeatureCollectionWithStats<FeaturePropertiesT> {
   const positions = new Float32Array(data.length * 2);
   const featureIds = new Uint16Array(data.length);
   for (let i = 0; i < data.length; i++) {

package/src/style/color-bins-style.ts

@@ -42,8 +42,8 @@ export default function colorBins<DataT = Feature>({
 
   const color = scaleThreshold<number, Color>().domain(domain).range(palette);
 
-  return d => {
-    const value = getAttrValue(attr, d);
+  return (d, info) => {
+    const value = getAttrValue(attr, d, info);
     return typeof value === 'number' && Number.isFinite(value) ? color(value) : nullColor;
   };
 }

package/src/style/color-categories-style.ts

@@ -48,8 +48,8 @@ export default function colorCategories<DataT = Feature>({
     colorsByCategory[c] = palette[i];
   }
 
-  return d => {
-    const value = getAttrValue(attr, d);
+  return (d, info) => {
+    const value = getAttrValue(attr, d, info);
     return (typeof value === 'number' && Number.isFinite(value)) || typeof value === 'string'
       ? colorsByCategory[value] || othersColor
       : nullColor;

package/src/style/color-continuous-style.ts

@@ -41,8 +41,8 @@ export default function colorContinuous<DataT = Feature>({
   const palette = typeof colors === 'string' ? getPalette(colors, domain.length) : colors;
   const color = scaleLinear<Color>().domain(domain).range(palette);
 
-  return d => {
-    const value = getAttrValue(attr, d);
+  return (d, info) => {
+    const value = getAttrValue(attr, d, info);
     return typeof value === 'number' && Number.isFinite(value) ? color(value) : nullColor;
   };
 }

package/src/style/utils.ts

@@ -3,18 +3,21 @@ import {assert} from '../utils';
 
 const ALLOWED_ATTR_TYPES = Object.freeze(['function', 'string']);
 
-export type AttributeSelector<DataT = Feature, OutT = any> = string | ((d: DataT) => OutT);
+export type AttributeSelector<DataT = Feature, OutT = any> =
+  | string
+  | ((d: DataT, info: any) => OutT);
 
 export function getAttrValue<DataT = Feature, OutT = any>(
   attr: string | AttributeSelector<DataT, OutT>,
-  d: DataT
+  d: DataT,
+  info: any
 ): OutT {
   assert(typeof d === 'object', 'Expected "data" to be an object');
   assert(ALLOWED_ATTR_TYPES.includes(typeof attr), 'Expected "attr" to be a function or string');
 
   // Is function
   if (typeof attr === 'function') {
-    return attr(d);
+    return attr(d, info);
   }
   return (d as unknown as Feature)?.properties?.[attr] as OutT;
 }