@deck.gl/carto 9.0.14 → 9.0.16

package/src/layers/heatmap.ts

@@ -12,6 +12,7 @@ const glsl = (s: TemplateStringsArray) => `${s}`;
 
 const fs = glsl`\
 uniform heatmapUniforms {
+  vec2 delta;
   float radiusPixels;
   vec2 colorDomain;
   vec3 color1;
@@ -57,11 +58,15 @@ vec3 colorGradient(float value) {
 }
 
 const vec3 SHIFT = vec3(1.0, 256.0, 256.0 * 256.0);
+vec4 pack(float value) {
+  return vec4(mod(vec3(value, floor(value / SHIFT.yz)), 256.0), 255.0) / 255.0;
+}
 float unpack(vec3 color) {
   return 255.0 * dot(color, SHIFT);
 }
 
 vec4 heatmap_sampleColor(sampler2D source, vec2 texSize, vec2 texCoord) {
+  bool firstPass = (heatmap.delta.y < 0.5);
   float accumulator = 0.0;
 
   // Randomize the lookup values to hide the fixed number of samples
@@ -70,11 +75,10 @@ vec4 heatmap_sampleColor(sampler2D source, vec2 texSize, vec2 texCoord) {
   // Gaussian normalization parameters
   const float sigma = SUPPORT / 3.0;
   const float a = -0.5 / (sigma * sigma);
-  const float w0 = 1.0 / (2.0 * 3.141592653589793 * sigma * sigma); // 2D normalization
+  const float w0 = 0.3989422804014327 / sigma; // 1D normalization
 
   for (float t = -SUPPORT; t <= SUPPORT; t++) {
-  for (float s = -SUPPORT; s <= SUPPORT; s++) {
-    vec2 percent = (vec2(s, t) + offset - 0.5) / SUPPORT;
+    vec2 percent = (t * heatmap.delta + offset - 0.5) / SUPPORT;
     vec2 delta = percent * heatmap.radiusPixels / texSize;
     vec4 offsetColor = texture(source, texCoord + delta);
 
@@ -82,10 +86,13 @@ vec4 heatmap_sampleColor(sampler2D source, vec2 texSize, vec2 texCoord) {
     float value = unpack(offsetColor.rgb);
 
     // Gaussian
-    float weight = w0 * exp(a * (s * s + t * t));
+    float weight = w0 * exp(a * t * t);
     
     accumulator += value * weight;
   }
+
+  if (firstPass) {
+    return pack(accumulator);
   }
 
   // Apply domain
@@ -114,9 +121,9 @@ const defaultColorRange: Color[] = [
 
 export type HeatmapProps = {
   /**
-   * Radius of the circle in pixels, to which the weight of an object is distributed.
+   * Radius of the heatmap blur in pixels, to which the weight of a cell is distributed.
    *
-   * @default 30
+   * @default 20
    */
   radiusPixels?: number;
   /**
@@ -135,6 +142,7 @@ export type HeatmapProps = {
 };
 
 export type HeatmapUniforms = {
+  delta?: [number, number];
   radiusPixels?: number;
   colorDomain?: [number, number];
   color1?: [number, number, number];
@@ -149,6 +157,7 @@ export type HeatmapUniforms = {
 export const heatmap: ShaderPass<HeatmapProps, HeatmapUniforms> = {
   name: 'heatmap',
   uniformPropTypes: {
+    delta: {value: [0, 1]},
     radiusPixels: {value: 20, min: 0, softMax: 100},
     colorDomain: {value: [0, 1]},
     color1: {value: [0, 0, 0]},
@@ -160,6 +169,7 @@ export const heatmap: ShaderPass<HeatmapProps, HeatmapUniforms> = {
     opacity: {value: 1, min: 0, max: 1}
   },
   uniformTypes: {
+    delta: 'vec2<f32>',
     radiusPixels: 'f32',
     colorDomain: 'vec2<f32>',
     color1: 'vec3<f32>',
@@ -172,13 +182,15 @@ export const heatmap: ShaderPass<HeatmapProps, HeatmapUniforms> = {
   },
   getUniforms: opts => {
     const {
+      delta = [1, 0],
       colorRange = defaultColorRange,
       radiusPixels = 20,
       colorDomain = [0, 1],
       opacity = 1
-    } = opts as HeatmapProps;
+    } = opts as HeatmapProps & {delta: [number, number]};
     const [color1, color2, color3, color4, color5, color6] = colorRange;
     return {
+      delta,
       color1,
       color2,
       color3,
@@ -192,5 +204,8 @@ export const heatmap: ShaderPass<HeatmapProps, HeatmapUniforms> = {
   },
   dependencies: [random],
   fs,
-  passes: [{sampler: true}]
+  passes: [
+    {sampler: true, uniforms: {delta: [1, 0]}},
+    {sampler: true, uniforms: {delta: [0, 1]}}
+  ]
 };

package/src/layers/quadbin-heatmap-tile-layer.ts

@@ -1,11 +1,13 @@
 import {getResolution} from 'quadbin';
 
-import {Accessor, CompositeLayer, DefaultProps, Layer} from '@deck.gl/core';
+import {Accessor, CompositeLayer, CompositeLayerProps, DefaultProps, Layer} from '@deck.gl/core';
 import {SolidPolygonLayer} from '@deck.gl/layers';
 
 import {HeatmapProps, heatmap} from './heatmap';
 import {RTTModifier, PostProcessModifier} from './post-process-utils';
 import QuadbinTileLayer, {QuadbinTileLayerProps} from './quadbin-tile-layer';
+import {TilejsonPropType} from './utils';
+import {TilejsonResult} from '../sources';
 
 // Modified polygon layer to draw offscreen and output value expected by heatmap
 class RTTSolidPolygonLayer extends RTTModifier(SolidPolygonLayer) {
@@ -50,14 +52,15 @@ function encodeWeight(w: number) {
 }
 
 const defaultProps: DefaultProps<QuadbinHeatmapTileLayerProps> = {
-  ...QuadbinTileLayer.defaultProps,
-
+  data: TilejsonPropType,
   getWeight: {type: 'accessor', value: 1}
 };
 
 /** All properties supported by QuadbinHeatmapTileLayer. */
 export type QuadbinHeatmapTileLayerProps<DataT = unknown> = _QuadbinHeatmapTileLayerProps<DataT> &
-  QuadbinTileLayerProps;
+  CompositeLayerProps & {
+    data: null | TilejsonResult | Promise<TilejsonResult>;
+  };
 
 /** Properties added by QuadbinHeatmapTileLayer. */
 type _QuadbinHeatmapTileLayerProps<DataT> = QuadbinTileLayerProps<DataT> &

package/src/utils.ts

@@ -59,3 +59,8 @@ export function scaleIdentity() {
 
   return scale;
 }
+
+export const isObject: (x: unknown) => boolean = x => x !== null && typeof x === 'object';
+
+export const isPureObject: (x: any) => boolean = x =>
+  isObject(x) && x.constructor === {}.constructor;