@deck.gl/aggregation-layers 9.0.35 → 9.1.0-beta.1

package/dist/contour-layer/bin-options-uniforms.d.ts

@@ -0,0 +1,13 @@
+export type BinOptions = {
+    cellOriginCommon: [number, number];
+    cellSizeCommon: [number, number];
+};
+export declare const binOptionsUniforms: {
+    readonly name: "binOptions";
+    readonly vs: "uniform binOptionsUniforms {\n  vec2 cellOriginCommon;\n  vec2 cellSizeCommon;\n} binOptions;\n";
+    readonly uniformTypes: {
+        readonly cellOriginCommon: "vec2<f32>";
+        readonly cellSizeCommon: "vec2<f32>";
+    };
+};
+//# sourceMappingURL=bin-options-uniforms.d.ts.map

package/dist/contour-layer/bin-options-uniforms.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bin-options-uniforms.d.ts","sourceRoot":"","sources":["../../src/contour-layer/bin-options-uniforms.ts"],"names":[],"mappings":"AAaA,MAAM,MAAM,UAAU,GAAG;IACvB,gBAAgB,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CAClC,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;;;;;CAOc,CAAC"}

package/dist/contour-layer/bin-options-uniforms.js

@@ -0,0 +1,17 @@
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+const uniformBlock = /* glsl */ `\
+uniform binOptionsUniforms {
+  vec2 cellOriginCommon;
+  vec2 cellSizeCommon;
+} binOptions;
+`;
+export const binOptionsUniforms = {
+    name: 'binOptions',
+    vs: uniformBlock,
+    uniformTypes: {
+        cellOriginCommon: 'vec2<f32>',
+        cellSizeCommon: 'vec2<f32>'
+    }
+};

package/dist/contour-layer/contour-layer.d.ts

@@ -1,48 +1,38 @@
-import { Accessor, AccessorFunction, Color, Position, UpdateParameters, DefaultProps, LayersList } from '@deck.gl/core';
-import GridAggregationLayer, { GridAggregationLayerProps } from "../grid-aggregation-layer.js";
-/** All properties supported by ContourLayer. */
-export type ContourLayerProps<DataT = unknown> = _ContourLayerProps<DataT> & GridAggregationLayerProps<DataT>;
-/** Properties added by ContourLayer. */
-export type _ContourLayerProps<DataT> = {
+import { Accessor, GetPickingInfoParams, LayersList, PickingInfo, Position, Viewport, UpdateParameters, DefaultProps } from '@deck.gl/core';
+import { WebGLAggregator, CPUAggregator, AggregationOperation } from "../common/aggregator/index.js";
+import AggregationLayer from "../common/aggregation-layer.js";
+import { AggregationLayerProps } from "../common/aggregation-layer.js";
+import { Contour, ContourLine, ContourPolygon } from "./contour-utils.js";
+import { BinOptions } from "./bin-options-uniforms.js";
+/** All properties supported by GridLayer. */
+export type ContourLayerProps<DataT = unknown> = _ContourLayerProps<DataT> & AggregationLayerProps<DataT>;
+/** Properties added by GridLayer. */
+type _ContourLayerProps<DataT> = {
     /**
      * Size of each cell in meters.
      * @default 1000
      */
     cellSize?: number;
+    /**
+     * The grid origin
+     * @default [0, 0]
+     */
+    gridOrigin?: [number, number];
     /**
      * When set to true, aggregation is performed on GPU, provided other conditions are met.
-     * @default true
+     * @default false
      */
     gpuAggregation?: boolean;
     /**
      * Defines the type of aggregation operation, valid values are 'SUM', 'MEAN', 'MIN' and 'MAX'.
      * @default 'SUM'
      */
-    aggregation?: 'SUM' | 'MEAN' | 'MIN' | 'MAX';
+    aggregation?: AggregationOperation;
     /**
      * Definition of contours to be drawn.
      * @default [{threshold: 1}]
      */
-    contours: {
-        /**
-         * Isolines: `threshold` value must be a single `Number`, Isolines are generated based on this threshold value.
-         *
-         * Isobands: `threshold` value must be an Array of two `Number`s. Isobands are generated using `[threshold[0], threshold[1])` as threshold range, i.e area that has values `>= threshold[0]` and `< threshold[1]` are rendered with corresponding color. NOTE: `threshold[0]` is inclusive and `threshold[1]` is not inclusive.
-         */
-        threshold: number | number[];
-        /**
-         * RGBA color array to be used to render the contour.
-         * @default [255, 255, 255, 255]
-         */
-        color?: Color;
-        /**
-         * Applicable for `Isoline`s only, width of the Isoline in pixels.
-         * @default 1
-         */
-        strokeWidth?: number;
-        /** Defines z order of the contour. */
-        zIndex?: number;
-    }[];
+    contours?: Contour[];
     /**
      * A very small z offset that is added for each vertex of a contour (Isoline or Isoband).
      * @default 0.005
@@ -52,38 +42,40 @@ export type _ContourLayerProps<DataT> = {
      * Method called to retrieve the position of each object.
      * @default object => object.position
      */
-    getPosition?: AccessorFunction<DataT, Position>;
+    getPosition?: Accessor<DataT, Position>;
     /**
      * The weight of each object.
      * @default 1
      */
     getWeight?: Accessor<DataT, number>;
 };
-/** Aggregate data into iso-lines or iso-bands for a given threshold and cell size. */
-export default class ContourLayer<DataT = any, ExtraPropsT extends {} = {}> extends GridAggregationLayer<DataT, ExtraPropsT & Required<_ContourLayerProps<DataT>>> {
+export type ContourLayerPickingInfo = PickingInfo<{
+    contour: Contour;
+}>;
+/** Aggregate data into a grid-based heatmap. The color and height of a cell are determined based on the objects it contains. */
+export default class GridLayer<DataT = any, ExtraPropsT extends {} = {}> extends AggregationLayer<DataT, ExtraPropsT & Required<_ContourLayerProps<DataT>>> {
     static layerName: string;
     static defaultProps: DefaultProps<ContourLayerProps<unknown>>;
-    state: GridAggregationLayer<DataT>['state'] & {
-        contourData: {
-            contourSegments: {
-                start: number[];
-                end: number[];
-                contour: any;
-            }[];
-            contourPolygons: {
-                vertices: number[][];
-                contour: any;
-            }[];
+    state: AggregationLayer<DataT>['state'] & BinOptions & {
+        aggregatedValueReader?: (x: number, y: number) => number;
+        contourData?: {
+            lines: ContourLine[];
+            polygons: ContourPolygon[];
         };
-        thresholdData: any;
+        binIdRange: [number, number][];
+        aggregatorViewport: Viewport;
     };
+    getAggregatorType(): string;
+    createAggregator(type: string): WebGLAggregator | CPUAggregator;
     initializeState(): void;
-    updateState(opts: UpdateParameters<this>): void;
-    renderLayers(): LayersList;
-    updateAggregationState(opts: UpdateParameters<this>): void;
-    private _updateAccessors;
-    private _resetResults;
-    private _generateContours;
-    private _updateThresholdData;
+    updateState(params: UpdateParameters<this>): boolean;
+    private _updateBinOptions;
+    draw(opts: any): void;
+    private _onAggregationUpdate;
+    private _getContours;
+    onAttributeChange(id: string): void;
+    renderLayers(): LayersList | null;
+    getPickingInfo(params: GetPickingInfoParams): ContourLayerPickingInfo;
 }
+export {};
 //# sourceMappingURL=contour-layer.d.ts.map

package/dist/contour-layer/contour-layer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"contour-layer.d.ts","sourceRoot":"","sources":["../../src/contour-layer/contour-layer.ts"],"names":[],"mappings":"AAsBA,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,KAAK,EAEL,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACX,MAAM,eAAe,CAAC;AAKvB,OAAO,oBAAoB,EAAE,EAAC,yBAAyB,EAAC,qCAAkC;AAqC1F,gDAAgD;AAChD,MAAM,MAAM,iBAAiB,CAAC,KAAK,GAAG,OAAO,IAAI,kBAAkB,CAAC,KAAK,CAAC,GACxE,yBAAyB,CAAC,KAAK,CAAC,CAAC;AAEnC,wCAAwC;AACxC,MAAM,MAAM,kBAAkB,CAAC,KAAK,IAAI;IACtC;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,WAAW,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,KAAK,CAAC;IAE7C;;;OAGG;IACH,QAAQ,EAAE;QACR;;;;WAIG;QACH,SAAS,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;QAE7B;;;WAGG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC;QAEd;;;WAGG;QACH,WAAW,CAAC,EAAE,MAAM,CAAC;QAErB,sCAAsC;QACtC,MAAM,CAAC,EAAE,MAAM,CAAC;KACjB,EAAE,CAAC;IAEJ;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;IAEhD;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;CACrC,CAAC;AAEF,sFAAsF;AACtF,MAAM,CAAC,OAAO,OAAO,YAAY,CAC/B,KAAK,GAAG,GAAG,EACX,WAAW,SAAS,EAAE,GAAG,EAAE,CAC3B,SAAQ,oBAAoB,CAAC,KAAK,EAAE,WAAW,GAAG,QAAQ,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAAC;IACtF,MAAM,CAAC,SAAS,SAAkB;IAClC,MAAM,CAAC,YAAY,2CAAgB;IAEnC,KAAK,EAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,GAAG;QAC7C,WAAW,EAAE;YACX,eAAe,EAAE;gBACf,KAAK,EAAE,MAAM,EAAE,CAAC;gBAChB,GAAG,EAAE,MAAM,EAAE,CAAC;gBACd,OAAO,EAAE,GAAG,CAAC;aACd,EAAE,CAAC;YACJ,eAAe,EAAE;gBACf,QAAQ,EAAE,MAAM,EAAE,EAAE,CAAC;gBACrB,OAAO,EAAE,GAAG,CAAC;aACd,EAAE,CAAC;SACL,CAAC;QACF,aAAa,EAAE,GAAG,CAAC;KACpB,CAAC;IAEF,eAAe,IAAI,IAAI;IA2BvB,WAAW,CAAC,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC,GAAG,IAAI;IAgB/C,YAAY,IAAI,UAAU;IA4C1B,sBAAsB,CAAC,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAyEnD,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,iBAAiB;IAuBzB,OAAO,CAAC,oBAAoB;CAc7B"}
+{"version":3,"file":"contour-layer.d.ts","sourceRoot":"","sources":["../../src/contour-layer/contour-layer.ts"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EAER,oBAAoB,EAEpB,UAAU,EACV,WAAW,EACX,QAAQ,EACR,QAAQ,EAER,gBAAgB,EAChB,YAAY,EACb,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAC,eAAe,EAAE,aAAa,EAAE,oBAAoB,EAAC,sCAAmC;AAChG,OAAO,gBAAgB,uCAAoC;AAC3D,OAAO,EAAC,qBAAqB,EAAC,uCAAoC;AAClE,OAAO,EAAmB,OAAO,EAAE,WAAW,EAAE,cAAc,EAAC,2BAAwB;AAIvF,OAAO,EAAC,UAAU,EAAqB,kCAA+B;AAyBtE,6CAA6C;AAC7C,MAAM,MAAM,iBAAiB,CAAC,KAAK,GAAG,OAAO,IAAI,kBAAkB,CAAC,KAAK,CAAC,GACxE,qBAAqB,CAAC,KAAK,CAAC,CAAC;AAE/B,qCAAqC;AACrC,KAAK,kBAAkB,CAAC,KAAK,IAAI;IAC/B;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;;OAGG;IACH,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAE9B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,WAAW,CAAC,EAAE,oBAAoB,CAAC;IAEnC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,WAAW,CAAC,EAAE,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;IAExC;;;OAGG;IACH,SAAS,CAAC,EAAE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG,WAAW,CAAC;IAChD,OAAO,EAAE,OAAO,CAAC;CAClB,CAAC,CAAC;AAEH,gIAAgI;AAChI,MAAM,CAAC,OAAO,OAAO,SAAS,CAAC,KAAK,GAAG,GAAG,EAAE,WAAW,SAAS,EAAE,GAAG,EAAE,CAAE,SAAQ,gBAAgB,CAC/F,KAAK,EACL,WAAW,GAAG,QAAQ,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAClD;IACC,MAAM,CAAC,SAAS,SAAkB;IAClC,MAAM,CAAC,YAAY,2CAAgB;IAEnC,KAAK,EAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,GACtC,UAAU,GAAG;QAEX,qBAAqB,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,KAAK,MAAM,CAAC;QACzD,WAAW,CAAC,EAAE;YACZ,KAAK,EAAE,WAAW,EAAE,CAAC;YACrB,QAAQ,EAAE,cAAc,EAAE,CAAC;SAC5B,CAAC;QAEF,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,EAAE,CAAC;QAC/B,kBAAkB,EAAE,QAAQ,CAAC;KAC9B,CAAC;IAEJ,iBAAiB,IAAI,MAAM;IAM3B,gBAAgB,CAAC,IAAI,EAAE,MAAM,GAAG,eAAe,GAAG,aAAa;IA8C/D,eAAe;IAef,WAAW,CAAC,MAAM,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAmC1C,OAAO,CAAC,iBAAiB;IAsDhB,IAAI,CAAC,IAAI,KAAA;IAQlB,OAAO,CAAC,oBAAoB;IAQ5B,OAAO,CAAC,YAAY;IAwBpB,iBAAiB,CAAC,EAAE,EAAE,MAAM;IA2B5B,YAAY,IAAI,UAAU,GAAG,IAAI;IAsDjC,cAAc,CAAC,MAAM,EAAE,oBAAoB,GAAG,uBAAuB;CAWtE"}

package/dist/contour-layer/contour-layer.js

@@ -1,241 +1,281 @@
-// Copyright (c) 2015 - 2018 Uber Technologies, Inc.
-//
-// Permission is hereby granted, free of charge, to any person obtaining a copy
-// of this software and associated documentation files (the "Software"), to deal
-// in the Software without restriction, including without limitation the rights
-// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-// copies of the Software, and to permit persons to whom the Software is
-// furnished to do so, subject to the following conditions:
-//
-// The above copyright notice and this permission notice shall be included in
-// all copies or substantial portions of the Software.
-//
-// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-// THE SOFTWARE.
-import { LineLayer, SolidPolygonLayer } from '@deck.gl/layers';
+// deck.gl
+// SPDX-License-Identifier: MIT
+// Copyright (c) vis.gl contributors
+import { COORDINATE_SYSTEM, project32, Viewport, _deepEqual } from '@deck.gl/core';
+import { PathLayer, SolidPolygonLayer } from '@deck.gl/layers';
+import { WebGLAggregator, CPUAggregator } from "../common/aggregator/index.js";
+import AggregationLayer from "../common/aggregation-layer.js";
 import { generateContours } from "./contour-utils.js";
-import { log } from '@deck.gl/core';
-import GPUGridAggregator from "../utils/gpu-grid-aggregation/gpu-grid-aggregator.js";
-import { AGGREGATION_OPERATION, getValueFunc } from "../utils/aggregation-operation-utils.js";
-import { getBoundingBox, getGridParams } from "../utils/grid-aggregation-utils.js";
-import GridAggregationLayer from "../grid-aggregation-layer.js";
+import { getAggregatorValueReader } from "./value-reader.js";
+import { getBinIdRange } from "../common/utils/bounds-utils.js";
+import { Matrix4 } from '@math.gl/core';
+import { binOptionsUniforms } from "./bin-options-uniforms.js";
 const DEFAULT_COLOR = [255, 255, 255, 255];
 const DEFAULT_STROKE_WIDTH = 1;
-const DEFAULT_THRESHOLD = 1;
 const defaultProps = {
     // grid aggregation
-    cellSize: { type: 'number', min: 1, max: 1000, value: 1000 },
+    cellSize: { type: 'number', min: 1, value: 1000 },
+    gridOrigin: { type: 'array', compare: true, value: [0, 0] },
     getPosition: { type: 'accessor', value: (x) => x.position },
     getWeight: { type: 'accessor', value: 1 },
-    gpuAggregation: false, // TODO(v9): Re-enable GPU aggregation.
+    gpuAggregation: true,
     aggregation: 'SUM',
     // contour lines
     contours: {
         type: 'object',
-        value: [{ threshold: DEFAULT_THRESHOLD }],
+        value: [{ threshold: 1 }],
         optional: true,
         compare: 3
     },
     zOffset: 0.005
 };
-const POSITION_ATTRIBUTE_NAME = 'positions';
-const DIMENSIONS = {
-    data: {
-        props: ['cellSize']
-    },
-    weights: {
-        props: ['aggregation'],
-        accessors: ['getWeight']
+/** Aggregate data into a grid-based heatmap. The color and height of a cell are determined based on the objects it contains. */
+class GridLayer extends AggregationLayer {
+    getAggregatorType() {
+        return this.props.gpuAggregation && WebGLAggregator.isSupported(this.context.device)
+            ? 'gpu'
+            : 'cpu';
     }
-};
-/** Aggregate data into iso-lines or iso-bands for a given threshold and cell size. */
-class ContourLayer extends GridAggregationLayer {
-    initializeState() {
-        super.initializeAggregationLayer({
-            dimensions: DIMENSIONS
-        });
-        this.setState({
-            contourData: {},
-            projectPoints: false,
-            weights: {
-                count: {
-                    size: 1,
-                    operation: AGGREGATION_OPERATION.SUM
-                }
-            }
+    createAggregator(type) {
+        if (type === 'cpu') {
+            return new CPUAggregator({
+                dimensions: 2,
+                getBin: {
+                    sources: ['positions'],
+                    getValue: ({ positions }, index, opts) => {
+                        const viewport = this.state.aggregatorViewport;
+                        // project to common space
+                        const p = viewport.projectPosition(positions);
+                        const { cellSizeCommon, cellOriginCommon } = opts;
+                        return [
+                            Math.floor((p[0] - cellOriginCommon[0]) / cellSizeCommon[0]),
+                            Math.floor((p[1] - cellOriginCommon[1]) / cellSizeCommon[1])
+                        ];
+                    }
+                },
+                getValue: [{ sources: ['counts'], getValue: ({ counts }) => counts }],
+                onUpdate: this._onAggregationUpdate.bind(this)
+            });
+        }
+        return new WebGLAggregator(this.context.device, {
+            dimensions: 2,
+            channelCount: 1,
+            bufferLayout: this.getAttributeManager().getBufferLayouts({ isInstanced: false }),
+            ...super.getShaders({
+                modules: [project32, binOptionsUniforms],
+                vs: /* glsl */ `
+  in vec3 positions;
+  in vec3 positions64Low;
+  in float counts;
+
+  void getBin(out ivec2 binId) {
+    vec3 positionCommon = project_position(positions, positions64Low);
+    vec2 gridCoords = floor(positionCommon.xy / binOptions.cellSizeCommon);
+    binId = ivec2(gridCoords);
+  }
+  void getValue(out float value) {
+    value = counts;
+  }
+  `
+            }),
+            onUpdate: this._onAggregationUpdate.bind(this)
         });
+    }
+    initializeState() {
+        super.initializeState();
         const attributeManager = this.getAttributeManager();
         attributeManager.add({
-            [POSITION_ATTRIBUTE_NAME]: {
+            positions: {
                 size: 3,
                 accessor: 'getPosition',
                 type: 'float64',
                 fp64: this.use64bitPositions()
             },
-            // this attribute is used in gpu aggregation path only
-            count: { size: 3, accessor: 'getWeight' }
+            counts: { size: 1, accessor: 'getWeight' }
+        });
+    }
+    updateState(params) {
+        const aggregatorChanged = super.updateState(params);
+        const { props, oldProps, changeFlags } = params;
+        const { aggregator } = this.state;
+        if (aggregatorChanged ||
+            changeFlags.dataChanged ||
+            props.cellSize !== oldProps.cellSize ||
+            !_deepEqual(props.gridOrigin, oldProps.gridOrigin, 1) ||
+            props.aggregation !== oldProps.aggregation) {
+            this._updateBinOptions();
+            const { cellSizeCommon, cellOriginCommon, binIdRange } = this.state;
+            aggregator.setProps({
+                // @ts-expect-error only used by GPUAggregator
+                binIdRange,
+                pointCount: this.getNumInstances(),
+                operations: [props.aggregation],
+                binOptions: {
+                    cellSizeCommon,
+                    cellOriginCommon
+                }
+            });
+        }
+        if (!_deepEqual(oldProps.contours, props.contours, 2)) {
+            // Recalculate contours
+            this.setState({ contourData: null });
+        }
+        return aggregatorChanged;
+    }
+    _updateBinOptions() {
+        const bounds = this.getBounds();
+        const cellSizeCommon = [1, 1];
+        let cellOriginCommon = [0, 0];
+        let binIdRange = [
+            [0, 1],
+            [0, 1]
+        ];
+        let viewport = this.context.viewport;
+        if (bounds && Number.isFinite(bounds[0][0])) {
+            let centroid = [(bounds[0][0] + bounds[1][0]) / 2, (bounds[0][1] + bounds[1][1]) / 2];
+            const { cellSize, gridOrigin } = this.props;
+            const { unitsPerMeter } = viewport.getDistanceScales(centroid);
+            cellSizeCommon[0] = unitsPerMeter[0] * cellSize;
+            cellSizeCommon[1] = unitsPerMeter[1] * cellSize;
+            // Offset common space to center at the origin of the grid cell where the data center is in
+            // This improves precision without affecting the cell positions
+            const centroidCommon = viewport.projectFlat(centroid);
+            cellOriginCommon = [
+                Math.floor((centroidCommon[0] - gridOrigin[0]) / cellSizeCommon[0]) * cellSizeCommon[0] +
+                    gridOrigin[0],
+                Math.floor((centroidCommon[1] - gridOrigin[1]) / cellSizeCommon[1]) * cellSizeCommon[1] +
+                    gridOrigin[1]
+            ];
+            centroid = viewport.unprojectFlat(cellOriginCommon);
+            const ViewportType = viewport.constructor;
+            // We construct a viewport for the GPU aggregator's project module
+            // This viewport is determined by data
+            // removes arbitrary precision variance that depends on initial view state
+            viewport = viewport.isGeospatial
+                ? new ViewportType({ longitude: centroid[0], latitude: centroid[1], zoom: 12 })
+                : new Viewport({ position: [centroid[0], centroid[1], 0], zoom: 12 });
+            // Round to the nearest 32-bit float to match CPU and GPU results
+            cellOriginCommon = [Math.fround(viewport.center[0]), Math.fround(viewport.center[1])];
+            binIdRange = getBinIdRange({
+                dataBounds: bounds,
+                getBinId: (p) => {
+                    const positionCommon = viewport.projectFlat(p);
+                    return [
+                        Math.floor((positionCommon[0] - cellOriginCommon[0]) / cellSizeCommon[0]),
+                        Math.floor((positionCommon[1] - cellOriginCommon[1]) / cellSizeCommon[1])
+                    ];
+                }
+            });
+        }
+        this.setState({ cellSizeCommon, cellOriginCommon, binIdRange, aggregatorViewport: viewport });
+    }
+    draw(opts) {
+        // Replaces render time viewport with our own
+        if (opts.shaderModuleProps.project) {
+            opts.shaderModuleProps.project.viewport = this.state.aggregatorViewport;
+        }
+        super.draw(opts);
+    }
+    _onAggregationUpdate() {
+        const { aggregator, binIdRange } = this.state;
+        this.setState({
+            aggregatedValueReader: getAggregatorValueReader({ aggregator, binIdRange, channel: 0 }),
+            contourData: null
         });
     }
-    updateState(opts) {
-        super.updateState(opts);
-        let contoursChanged = false;
-        const { oldProps, props } = opts;
-        const { aggregationDirty } = this.state;
-        if (oldProps.contours !== props.contours || oldProps.zOffset !== props.zOffset) {
-            contoursChanged = true;
-            this._updateThresholdData(opts.props);
+    _getContours() {
+        const { aggregatedValueReader } = this.state;
+        if (!aggregatedValueReader) {
+            return null;
         }
-        if (this.getNumInstances() > 0 && (aggregationDirty || contoursChanged)) {
-            this._generateContours();
+        if (!this.state.contourData) {
+            const { binIdRange } = this.state;
+            const { contours } = this.props;
+            const contourData = generateContours({
+                contours,
+                getValue: aggregatedValueReader,
+                xRange: binIdRange[0],
+                yRange: binIdRange[1]
+            });
+            this.state.contourData = contourData;
+        }
+        return this.state.contourData;
+    }
+    onAttributeChange(id) {
+        const { aggregator } = this.state;
+        switch (id) {
+            case 'positions':
+                aggregator.setNeedsUpdate();
+                this._updateBinOptions();
+                const { cellSizeCommon, cellOriginCommon, binIdRange } = this.state;
+                aggregator.setProps({
+                    // @ts-expect-error only used by GPUAggregator
+                    binIdRange,
+                    binOptions: {
+                        cellSizeCommon,
+                        cellOriginCommon
+                    }
+                });
+                break;
+            case 'counts':
+                aggregator.setNeedsUpdate(0);
+                break;
+            default:
+            // This should not happen
         }
     }
     renderLayers() {
-        const { contourSegments, contourPolygons } = this.state.contourData;
-        const LinesSubLayerClass = this.getSubLayerClass('lines', LineLayer);
+        const contourData = this._getContours();
+        if (!contourData) {
+            return null;
+        }
+        const { lines, polygons } = contourData;
+        const { zOffset } = this.props;
+        const { cellOriginCommon, cellSizeCommon } = this.state;
+        const LinesSubLayerClass = this.getSubLayerClass('lines', PathLayer);
         const BandsSubLayerClass = this.getSubLayerClass('bands', SolidPolygonLayer);
+        const modelMatrix = new Matrix4()
+            .translate([cellOriginCommon[0], cellOriginCommon[1], 0])
+            .scale([cellSizeCommon[0], cellSizeCommon[1], zOffset]);
         // Contour lines layer
-        const lineLayer = contourSegments &&
-            contourSegments.length > 0 &&
+        const lineLayer = lines &&
+            lines.length > 0 &&
             new LinesSubLayerClass(this.getSubLayerProps({
                 id: 'lines'
             }), {
-                data: this.state.contourData.contourSegments,
-                getSourcePosition: d => d.start,
-                getTargetPosition: d => d.end,
-                getColor: d => d.contour.color || DEFAULT_COLOR,
-                getWidth: d => d.contour.strokeWidth || DEFAULT_STROKE_WIDTH
+                data: lines,
+                coordinateSystem: COORDINATE_SYSTEM.CARTESIAN,
+                modelMatrix,
+                getPath: d => d.vertices,
+                getColor: d => d.contour.color ?? DEFAULT_COLOR,
+                getWidth: d => d.contour.strokeWidth ?? DEFAULT_STROKE_WIDTH,
+                widthUnits: 'pixels'
             });
         // Contour bands layer
-        const bandsLayer = contourPolygons &&
-            contourPolygons.length > 0 &&
+        const bandsLayer = polygons &&
+            polygons.length > 0 &&
             new BandsSubLayerClass(this.getSubLayerProps({
                 id: 'bands'
             }), {
-                data: this.state.contourData.contourPolygons,
+                data: polygons,
+                coordinateSystem: COORDINATE_SYSTEM.CARTESIAN,
+                modelMatrix,
                 getPolygon: d => d.vertices,
-                getFillColor: d => d.contour.color || DEFAULT_COLOR
+                getFillColor: d => d.contour.color ?? DEFAULT_COLOR
             });
         return [lineLayer, bandsLayer];
     }
-    // Aggregation Overrides
-    /* eslint-disable max-statements, complexity */
-    updateAggregationState(opts) {
-        const { props, oldProps } = opts;
-        const { cellSize, coordinateSystem } = props;
-        const { viewport } = this.context;
-        const cellSizeChanged = oldProps.cellSize !== cellSize;
-        let gpuAggregation = props.gpuAggregation;
-        if (this.state.gpuAggregation !== props.gpuAggregation) {
-            if (gpuAggregation && !GPUGridAggregator.isSupported(this.context.device)) {
-                log.warn('GPU Grid Aggregation not supported, falling back to CPU')();
-                gpuAggregation = false;
-            }
-        }
-        const gpuAggregationChanged = gpuAggregation !== this.state.gpuAggregation;
-        this.setState({
-            gpuAggregation
-        });
-        const { dimensions } = this.state;
-        const positionsChanged = this.isAttributeChanged(POSITION_ATTRIBUTE_NAME);
-        const { data, weights } = dimensions;
-        let { boundingBox } = this.state;
-        if (positionsChanged) {
-            boundingBox = getBoundingBox(this.getAttributes(), this.getNumInstances());
-            this.setState({ boundingBox });
-        }
-        if (positionsChanged || cellSizeChanged) {
-            const { gridOffset, translation, width, height, numCol, numRow } = getGridParams(boundingBox, cellSize, viewport, coordinateSystem);
-            this.allocateResources(numRow, numCol);
-            this.setState({
-                gridOffset,
-                boundingBox,
-                translation,
-                posOffset: translation.slice(), // Used for CPU aggregation, to offset points
-                gridOrigin: [-1 * translation[0], -1 * translation[1]],
-                width,
-                height,
-                numCol,
-                numRow
-            });
-        }
-        const aggregationDataDirty = positionsChanged ||
-            gpuAggregationChanged ||
-            this.isAggregationDirty(opts, {
-                dimension: data,
-                compareAll: gpuAggregation // check for all (including extentions props) when using gpu aggregation
-            });
-        const aggregationWeightsDirty = this.isAggregationDirty(opts, {
-            dimension: weights
-        });
-        if (aggregationWeightsDirty) {
-            this._updateAccessors(opts);
-        }
-        if (aggregationDataDirty || aggregationWeightsDirty) {
-            this._resetResults();
-        }
-        this.setState({
-            aggregationDataDirty,
-            aggregationWeightsDirty
-        });
-    }
-    /* eslint-enable max-statements, complexity */
-    // Private (Aggregation)
-    _updateAccessors(opts) {
-        const { getWeight, aggregation, data } = opts.props;
-        const { count } = this.state.weights;
-        if (count) {
-            count.getWeight = getWeight;
-            count.operation = AGGREGATION_OPERATION[aggregation];
-        }
-        this.setState({ getValue: getValueFunc(aggregation, getWeight, { data }) });
-    }
-    _resetResults() {
-        const { count } = this.state.weights;
-        if (count) {
-            count.aggregationData = null;
-        }
-    }
-    // Private (Contours)
-    _generateContours() {
-        const { numCol, numRow, gridOrigin, gridOffset, thresholdData } = this.state;
-        const { count } = this.state.weights;
-        let { aggregationData } = count;
-        if (!aggregationData) {
-            // @ts-ignore
-            aggregationData = count.aggregationBuffer.readSyncWebGL();
-            count.aggregationData = aggregationData;
-        }
-        const { cellWeights } = GPUGridAggregator.getCellData({ countsData: aggregationData });
-        const contourData = generateContours({
-            thresholdData,
-            cellWeights,
-            gridSize: [numCol, numRow],
-            gridOrigin,
-            cellSize: [gridOffset.xOffset, gridOffset.yOffset]
-        });
-        // contourData contains both iso-lines and iso-bands if requested.
-        this.setState({ contourData });
-    }
-    _updateThresholdData(props) {
-        const { contours, zOffset } = props;
-        const count = contours.length;
-        const thresholdData = new Array(count);
-        for (let i = 0; i < count; i++) {
-            const contour = contours[i];
-            thresholdData[i] = {
-                contour,
-                zIndex: contour.zIndex || i,
-                zOffset
+    getPickingInfo(params) {
+        const info = params.info;
+        const { object } = info;
+        if (object) {
+            info.object = {
+                contour: object.contour
             };
         }
-        this.setState({ thresholdData });
+        return info;
     }
 }
-ContourLayer.layerName = 'ContourLayer';
-ContourLayer.defaultProps = defaultProps;
-export default ContourLayer;
+GridLayer.layerName = 'ContourLayer';
+GridLayer.defaultProps = defaultProps;
+export default GridLayer;