@carto/api-client 0.5.15-alpha.raster-0 → 0.5.15-alpha.raster-2

package/package.json

@@ -8,7 +8,7 @@
   "homepage": "https://github.com/CartoDB/carto-api-client#readme",
   "author": "Don McCurdy <donmccurdy@carto.com>",
   "packageManager": "yarn@4.3.1",
-  "version": "0.5.15-alpha.raster-0",
+  "version": "0.5.15-alpha.raster-2",
   "license": "MIT",
   "publishConfig": {
     "access": "public"

package/src/fetch-map/basemap-styles.ts

@@ -92,7 +92,7 @@ export const STYLE_LAYER_GROUPS: StyleLayerGroup[] = [
 ];
 
 export function applyLayerGroupFilters(
-  style: any,
+  style: any, // this Maplibre/Mapbox style, we don't want to add a dependency on Maplibre
   visibleLayerGroups: Record<StyleLayerGroupSlug, boolean>
 ) {
   if (!Array.isArray(style?.layers)) {

package/src/fetch-map/index.ts

@@ -1,4 +1,7 @@
-export {default as BASEMAP} from './basemap-styles.js';
+export {
+  default as BASEMAP,
+  applyLayerGroupFilters as _applyLayerGroupFilters,
+} from './basemap-styles.js';
 export {getRasterTileLayerStyleProps as _getRasterTileLayerStyleProps} from './raster-layer.js';
 export {fetchMap} from './fetch-map.js';
 export type {FetchMapOptions, FetchMapResult} from './fetch-map.js';
@@ -12,3 +15,4 @@ export type {
 export * from './basemap.js';
 export * from './layer-map.js';
 export * from './parse-map.js';
+export {getLog10ScaleSteps as _getLog10ScaleSteps} from './utils.js';

package/src/fetch-map/layer-map.ts

@@ -25,6 +25,7 @@ import {
   createBinaryProxy,
   formatDate,
   formatTimestamp,
+  getLog10ScaleSteps,
   scaleIdentity,
 } from './utils.js';
 import type {
@@ -39,7 +40,7 @@ import type {
 import type {ProviderType, SchemaField} from '../types.js';
 import {DEFAULT_AGGREGATION_EXP_ALIAS} from '../constants-internal.js';
 import {AggregationTypes} from '../constants.js';
-import type {TilejsonResult} from '../sources/types.js';
+import type {Attribute, TilejsonResult} from '../sources/types.js';
 
 export type D3Scale = {
   domain: (d?: any) => any[];
@@ -211,10 +212,21 @@ export function getLayerProps(
 }
 
 function domainFromAttribute(
-  attribute: any,
-  scaleType: ScaleType,
+  attribute: Attribute,
+  scaleType: ScaleType | 'log10steps',
   scaleLength: number
-) {
+): number[] | string[] {
+  if (
+    scaleType === 'log10steps' &&
+    attribute.min !== undefined &&
+    attribute.max !== undefined
+  ) {
+    return getLog10ScaleSteps({
+      min: attribute.min,
+      max: attribute.max,
+      steps: scaleLength,
+    });
+  }
   if (scaleType === 'ordinal' || scaleType === 'point') {
     if (!attribute.categories) {
       return [0, 1];
@@ -225,7 +237,7 @@ function domainFromAttribute(
   }
 
   if (scaleType === 'quantile' && attribute.quantiles) {
-    return attribute.quantiles.global
+    return 'global' in attribute.quantiles
       ? attribute.quantiles.global[scaleLength]
       : attribute.quantiles[scaleLength];
   }
@@ -234,7 +246,7 @@ function domainFromAttribute(
   if (scaleType === 'log' && min === 0) {
     min = 1e-5;
   }
-  return [min, attribute.max];
+  return [min ?? 0, attribute.max ?? 1];
 }
 
 function domainFromValues(values: any, scaleType: ScaleType) {
@@ -256,14 +268,16 @@ function domainFromValues(values: any, scaleType: ScaleType) {
 function calculateDomain(
   data: TilejsonResult,
   name: string,
-  scaleType: ScaleType,
+  scaleType: ScaleType | 'log10steps',
   scaleLength?: number
 ) {
   if (data.tilestats) {
     // Tileset data type
     const {attributes} = data.tilestats.layers[0];
     const attribute = attributes.find((a: any) => a.attribute === name);
-    return domainFromAttribute(attribute, scaleType, scaleLength as number);
+    if (attribute) {
+      return domainFromAttribute(attribute, scaleType, scaleLength as number);
+    }
   }
 
   return [0, 1];
@@ -318,7 +332,7 @@ export function getColorAccessor(
   scaleType: ScaleType,
   {aggregation, range}: {aggregation: string; range: any},
   opacity: number | undefined,
-  data: any
+  data: TilejsonResult
 ): {accessor: any; scale: any} {
   const scale = calculateLayerScale(
     colorColumn || name,
@@ -348,19 +362,22 @@ export function calculateLayerScale(
 ) {
   let domain: string[] | number[] = [];
   let scaleColor: string[] = [];
+  const {colors} = range;
 
-  if (scaleType !== 'identity') {
-    const {colorMap, colors} = range;
-
-    if (Array.isArray(colorMap)) {
+  if (scaleType === 'custom') {
+    if (range.uiCustomScaleType === 'logarithmic') {
+      domain = calculateDomain(data, name, 'log10steps', colors.length);
+      scaleColor = colors;
+    } else if (range.colorMap) {
+      const {colorMap} = range;
       colorMap.forEach(([value, color]) => {
         (domain as string[]).push(value);
         scaleColor.push(color);
       });
-    } else {
-      domain = calculateDomain(data, name, scaleType, colors.length);
-      scaleColor = colors;
     }
+  } else if (scaleType !== 'identity') {
+    domain = calculateDomain(data, name, scaleType, colors.length);
+    scaleColor = colors;
 
     if (scaleType === 'ordinal') {
       domain = domain.slice(0, scaleColor.length);
@@ -456,7 +473,7 @@ export function getSizeAccessor(
   scaleType: ScaleType | undefined,
   aggregation: string | null | undefined,
   range: Iterable<Range> | null | undefined,
-  data: any
+  data: TilejsonResult
 ): {accessor: any; scale: any} {
   const scale = scaleType ? SCALE_FUNCS[scaleType]() : identity;
   if (scaleType) {

package/src/fetch-map/parse-map.ts

@@ -36,6 +36,7 @@ import {
   getRasterTileLayerStylePropsRgb,
   getRasterTileLayerStylePropsScaledBand,
 } from './raster-layer.js';
+import type {TilejsonResult} from '../sources/types.js';
 
 export type Scale = {
   field: VisualChannelField;
@@ -257,7 +258,7 @@ function createChannelProps(
   layerType: LayerType,
   config: MapLayerConfig,
   visualChannels: VisualChannels,
-  data: any,
+  data: TilejsonResult,
   dataset: Dataset
 ): {
   channelProps: Record<string, any>;
@@ -270,15 +271,24 @@ function createChannelProps(
     radiusScale,
     strokeColorField,
     strokeColorScale,
+    sizeField: strokeWidthField,
+    sizeScale: strokeWidthScale,
     weightField,
   } = visualChannels;
   if (layerType === 'raster') {
+    const rasterMetadata = data.raster_metadata;
+    if (!rasterMetadata) {
+      return {
+        channelProps: {},
+        scales: {},
+      };
+    }
     const rasterStyleType = config.visConfig.rasterStyleType;
     if (rasterStyleType === 'Rgb') {
       return {
         channelProps: getRasterTileLayerStylePropsRgb({
           layerConfig: config,
-          rasterMetadata: data.raster_metadata,
+          rasterMetadata,
           visualChannels,
         }),
         scales: {},
@@ -288,7 +298,7 @@ function createChannelProps(
         channelProps: getRasterTileLayerStylePropsScaledBand({
           layerConfig: config,
           visualChannels,
-          rasterMetadata: data.raster_metadata,
+          rasterMetadata,
         }),
         scales: {
           ...(colorField && {
@@ -427,6 +437,22 @@ function createChannelProps(
       ...domainAndRangeFromScale(scale),
     };
   }
+  if (strokeWidthField) {
+    const {accessor, scale} = getSizeAccessor(
+      strokeWidthField,
+      strokeWidthScale,
+      visConfig.sizeAggregation,
+      visConfig.sizeRange,
+      data
+    );
+    result.getLineWidth = accessor;
+    scales.lineWidth = updateTriggers.getLineWidth = {
+      field: strokeWidthField,
+      type: strokeWidthScale || 'identity',
+      ...domainAndRangeFromScale(scale),
+    };
+  }
+
   if (heightField && visConfig.enable3d) {
     const {accessor, scale} = getSizeAccessor(
       heightField,

package/src/fetch-map/raster-layer.ts

@@ -13,6 +13,7 @@ import type {
   VisualChannels,
 } from './types.js';
 import {createColorScale, type ScaleType} from './layer-map.js';
+import {getLog10ScaleSteps} from './utils.js';
 
 const UNKNOWN_COLOR = [134, 141, 145];
 
@@ -377,10 +378,11 @@ export function domainFromRasterMetadataBand(
   }
   if (scaleType === 'custom') {
     if (colorRange.uiCustomScaleType === 'logarithmic') {
-      if (colorRange.colorMap) {
-        return colorRange.colorMap?.map(([value]) => value) || [];
-      }
-      return [band.stats.min, band.stats.max];
+      return getLog10ScaleSteps({
+        min: band.stats.min,
+        max: band.stats.max,
+        steps: colorRange.colors.length,
+      });
     } else {
       // actually custom, read colorMap
       return colorRange.colorMap?.map(([value]) => value) || [];

package/src/fetch-map/utils.ts

@@ -85,3 +85,59 @@ export function formatDate(value: string | number | Date): string {
 export function formatTimestamp(value: string | number | Date): string {
   return String(Math.floor(new Date(value).getTime() / 1000));
 }
+
+function roundedPow10(exp: number) {
+  // Math.pow(10, less than 4) generates "0.0...009999999999999999" instead of "0.0...01"
+  // round it ...
+  const raw = Math.pow(10, exp);
+  if (exp < 0) {
+    const shift = Math.pow(10, -exp);
+    return Math.round(raw * shift) / shift;
+  }
+  return raw;
+}
+
+/**
+ * Create domain for D3 threshold scale with logarithmic steps.
+ *
+ * If min is 0, it starts with max and goes down to fill color scale.
+ * If max is Infinity, it starts with 10 and goes up to fill color scale.
+ * Othersise it starts on first power of 10 that is greater than min.
+ *
+ * Generates `steps-1` entries, as this is what d3 threshold scale expects
+ *
+ * @see https://d3js.org/d3-scale/threshold
+ */
+export function getLog10ScaleSteps({
+  min,
+  max,
+  steps,
+}: {
+  min: number;
+  max: number;
+  steps: number;
+}): number[] {
+  if (min === 0) {
+    if (max === Infinity) {
+      // count aggregations have [0, Infinity]
+      // that will yield [10, 100, 1000, ...]
+      return [...Array(steps - 1)].map((_v, i) => roundedPow10(i + 1));
+    }
+    // if stats.min = 0, we only can attempt to start from max and decrease powers until
+    // we use all color buckets ...
+    const maxLog = Math.log10(max);
+    const endExponent = Math.ceil(maxLog);
+    const startExponent = endExponent - steps + 1;
+    return [...Array(steps - 1)].map((_v, i) =>
+      roundedPow10(startExponent + i)
+    );
+  } else {
+    const minLog = Math.log10(min);
+    const startExponent =
+      Math.ceil(minLog) === minLog ? minLog + 1 : Math.ceil(minLog);
+
+    return [...Array(steps - 1)].map((_v, i) =>
+      roundedPow10(startExponent + i)
+    );
+  }
+}

package/src/fetch-map/vec-expr-evaluator.ts

@@ -66,18 +66,6 @@ export function validateVecExprSyntax(
   return validate(parsed, context);
 }
 
-export function createValidationContext(
-  validSymbols: string[]
-): Record<string, unknown> {
-  return validSymbols.reduce(
-    (acc, symbol) => {
-      acc[symbol] = 1;
-      return acc;
-    },
-    {} as Record<string, unknown>
-  );
-}
-
 export type VecExprVecLike =
   | number[]
   | Float32Array

package/src/index.ts

@@ -2,11 +2,6 @@ export * from './client.js';
 export * from './constants.js';
 export * from './deck/index.js';
 export * from './fetch-map/index.js';
-export type {
-  LayerDescriptor,
-  LayerType,
-  _getRasterTileLayerStyleProps,
-} from './fetch-map/index.js';
 export {
   createVecExprEvaluator as _createVecExprEvaluator,
   evaluateVecExpr as _evaluateVecExpr,

package/src/sources/types.ts

@@ -292,14 +292,64 @@ export interface Tilestats {
 
 export interface Layer {
   layer: string;
+  /** Number of features in the layer. */
   count: number;
+
+  /** Number of attributes in the layer. */
   attributeCount: number;
   attributes: Attribute[];
+
+  /** Type of geometry as in geojson geometry type (Point, LineString, Polygon, etc.) */
+  geometry?: string;
+}
+
+export interface AttributeCategoryItem {
+  category: string;
+  frequency: number;
+}
+
+/**
+ * Quantiles by number of buckets.
+ *
+ * Example:
+ * ```ts
+ *   {
+ *     // for 3 buckets, first 1/3 of items lies in range [min, 20], second 1/3 is in [20, 40], and last 1/3 is in [40, max]
+ *     3: [20, 40],
+ *     4: [20, 30, 50], for 4 buckets ...
+ *   }
+ * ```
+ */
+export interface QuantileStats {
+  [bucketCount: number]: number[];
 }
 
 export interface Attribute {
-  attribute: string;
+  /**
+   * String, Number, Timestamp, Boolean
+   */
   type: string;
+
+  /**
+   * Attribute name.
+   */
+  attribute: string;
+
+  // Stats for numeric attributes
+  min?: number;
+  max?: number;
+  sum?: number;
+
+  /** Quantiles by number of buckets */
+  quantiles?:
+    | {
+        // Quantile stats for numeric attributes in static spatial index tilesets are enclosed in extra global object
+        global: QuantileStats;
+      }
+    | QuantileStats;
+
+  // Stats for string/boolean attributes
+  categories?: AttributeCategoryItem[];
 }
 
 export interface VectorLayer {
@@ -325,17 +375,8 @@ export type RasterMetadataBandStats = {
 
   /**
    * Quantiles by number of buckets.
-   *
-   * Example:
-   * ```ts
-   *   {
-   *     // for 3 buckets, first 1/3 of items lies in range [min, 20], second 1/3 is in [20, 40], and last 1/3 is in [40, max]
-   *     3: [20, 40],
-   *     4: [20, 30, 50], for 4 buckets ...
-   *   }
-   * ```
    */
-  quantiles?: Record<number, number[]>;
+  quantiles?: QuantileStats;
 
   /**
    * Top values by number of values.