@deck.gl/aggregation-layers 8.8.0-alpha.6 → 8.8.0-beta.1

package/typed/aggregation-layer.d.ts

@@ -1,5 +1,14 @@
-declare class AggregationLayer extends CompositeLayer<any> {
-    constructor(...propObjects: Partial<any>[]);
+import { CompositeLayer, AttributeManager, UpdateParameters, CompositeLayerProps } from '@deck.gl/core/typed';
+export declare type AggregationLayerProps<DataT = any> = CompositeLayerProps<DataT>;
+export default abstract class AggregationLayer<ExtraPropsT = {}> extends CompositeLayer<ExtraPropsT> {
+    static layerName: string;
+    state: CompositeLayer['state'] & {
+        ignoreProps?: Record<string, any>;
+        dimensions?: any;
+    };
+    initializeAggregationLayer(dimensions: any): void;
+    updateState(opts: UpdateParameters<this>): void;
+    updateAttributes(changedAttributes: any): void;
     getAttributes(): {
         [id: string]: import("modules/core/src/lib/attribute/shader-attribute").IShaderAttribute;
     };
@@ -14,20 +23,16 @@ declare class AggregationLayer extends CompositeLayer<any> {
      * @returns {Boolean} - returns true if dimensions' prop or accessor is changed
      **/
     isAggregationDirty(updateOpts: any, params?: {
-        dimension: any;
-        compareAll: boolean;
-    }): boolean;
+        compareAll?: boolean;
+        dimension?: any;
+    }): string | boolean;
     /**
      * Checks if an attribute is changed
      * @param {String} name - name of the attribute
      * @returns {Boolean} - `true` if attribute `name` is changed, `false` otherwise,
      *                       If `name` is not passed or `undefiend`, `true` if any attribute is changed, `false` otherwise
      **/
-    isAttributeChanged(name: string): boolean;
-}
-declare namespace AggregationLayer {
-    const layerName: string;
+    isAttributeChanged(name?: string): any;
+    _getAttributeManager(): AttributeManager;
 }
-export default AggregationLayer;
-import { CompositeLayer } from '@deck.gl/core/typed';
 //# sourceMappingURL=aggregation-layer.d.ts.map

package/typed/aggregation-layer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"aggregation-layer.d.ts","sourceRoot":"","sources":["../src/aggregation-layer.js"],"names":[],"mappings":"AAwBA;IAdoB,4CAEN;IA4CZ;;MAEC;IAED,yBAYC;IAED,kCAEC;IAED;;;;;;;QAOI;IACJ;;;gBAuCC;IAED;;;;;QAKI;IACJ,0CAOC;CAWF"}
+{"version":3,"file":"aggregation-layer.d.ts","sourceRoot":"","sources":["../src/aggregation-layer.ts"],"names":[],"mappings":"AAoBA,OAAO,EACL,cAAc,EACd,gBAAgB,EAEhB,gBAAgB,EAChB,mBAAmB,EACpB,MAAM,eAAe,CAAC;AAIvB,oBAAY,qBAAqB,CAAC,KAAK,GAAG,GAAG,IAAI,mBAAmB,CAAC,KAAK,CAAC,CAAC;AAE5E,MAAM,CAAC,OAAO,CAAC,QAAQ,OAAO,gBAAgB,CAC5C,WAAW,GAAG,EAAE,CAChB,SAAQ,cAAc,CAAC,WAAW,CAAC;IACnC,MAAM,CAAC,SAAS,SAAsB;IAEtC,KAAK,EAAG,cAAc,CAAC,OAAO,CAAC,GAAG;QAChC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;QAClC,UAAU,CAAC,EAAE,GAAG,CAAC;KAClB,CAAC;IAEF,0BAA0B,CAAC,UAAU,EAAE,GAAG;IAU1C,WAAW,CAAC,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAexC,gBAAgB,CAAC,iBAAiB,KAAA;IAMlC,aAAa;;;IAIb,iBAAiB;IAcjB,aAAa,CAAC,OAAO,KAAA;IAIrB;;;;;;;QAOI;IACJ,kBAAkB,CAChB,UAAU,KAAA,EACV,MAAM,GAAE;QAAC,UAAU,CAAC,EAAE,OAAO,CAAC;QAAC,SAAS,CAAC,EAAE,GAAG,CAAA;KAAM,GACnD,MAAM,GAAG,OAAO;IAyCnB;;;;;QAKI;IACJ,kBAAkB,CAAC,IAAI,CAAC,EAAE,MAAM;IAYhC,oBAAoB;CAMrB"}

package/typed/aggregation-layer.js

@@ -0,0 +1,151 @@
+// Copyright (c) 2015 - 2017 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 { CompositeLayer, AttributeManager, _compareProps as compareProps } from '@deck.gl/core';
+import { cssToDeviceRatio } from '@luma.gl/core';
+import { filterProps } from './utils/prop-utils';
+export default class AggregationLayer extends CompositeLayer {
+    initializeAggregationLayer(dimensions) {
+        super.initializeState(this.context);
+        this.setState({
+            // Layer props , when changed doesn't require updating aggregation
+            ignoreProps: filterProps(this.constructor._propTypes, dimensions.data.props),
+            dimensions
+        });
+    }
+    updateState(opts) {
+        super.updateState(opts);
+        const { changeFlags } = opts;
+        if (changeFlags.extensionsChanged) {
+            const shaders = this.getShaders({});
+            if (shaders && shaders.defines) {
+                shaders.defines.NON_INSTANCED_MODEL = 1;
+            }
+            this.updateShaders(shaders);
+        }
+        // Explictly call to update attributes as 'CompositeLayer' doesn't call this
+        this._updateAttributes();
+    }
+    updateAttributes(changedAttributes) {
+        // Super classes, can refer to state.changedAttributes to determine what
+        // attributes changed
+        this.setState({ changedAttributes });
+    }
+    getAttributes() {
+        return this.getAttributeManager().getShaderAttributes();
+    }
+    getModuleSettings() {
+        // For regular layer draw this happens during draw cycle (_drawLayersInViewport) not during update cycle
+        // For aggregation layers this is called during updateState to update aggregation data
+        // NOTE: it is similar to LayerPass._getModuleParameters() but doesn't inlcude `effects` it is not needed for aggregation
+        const { viewport, mousePosition, gl } = this.context;
+        const moduleSettings = Object.assign(Object.create(this.props), {
+            viewport,
+            mousePosition,
+            pickingActive: 0,
+            devicePixelRatio: cssToDeviceRatio(gl)
+        });
+        return moduleSettings;
+    }
+    updateShaders(shaders) {
+        // Default implemention is empty, subclasses can update their Model objects if needed
+    }
+    /**
+     * Checks if aggregation is dirty
+     * @param {Object} updateOpts - object {props, oldProps, changeFlags}
+     * @param {Object} params - object {dimension, compareAll}
+     * @param {Object} params.dimension - {props, accessors} array of props and/or accessors
+     * @param {Boolean} params.compareAll - when `true` it will include non layer props for comparision
+     * @returns {Boolean} - returns true if dimensions' prop or accessor is changed
+     **/
+    isAggregationDirty(updateOpts, params = {}) {
+        const { props, oldProps, changeFlags } = updateOpts;
+        const { compareAll = false, dimension } = params;
+        const { ignoreProps } = this.state;
+        const { props: dataProps, accessors = [] } = dimension;
+        const { updateTriggersChanged } = changeFlags;
+        if (changeFlags.dataChanged) {
+            return true;
+        }
+        if (updateTriggersChanged) {
+            if (updateTriggersChanged.all) {
+                return true;
+            }
+            for (const accessor of accessors) {
+                if (updateTriggersChanged[accessor]) {
+                    return true;
+                }
+            }
+        }
+        if (compareAll) {
+            if (changeFlags.extensionsChanged) {
+                return true;
+            }
+            // Compare non layer props too (like extension props)
+            // ignoreprops refers to all Layer props other than aggregation props that need to be comapred
+            return compareProps({
+                oldProps,
+                newProps: props,
+                ignoreProps,
+                propTypes: this.constructor._propTypes
+            });
+        }
+        // Compare props of the dimension
+        for (const name of dataProps) {
+            if (props[name] !== oldProps[name]) {
+                return true;
+            }
+        }
+        return false;
+    }
+    /**
+     * Checks if an attribute is changed
+     * @param {String} name - name of the attribute
+     * @returns {Boolean} - `true` if attribute `name` is changed, `false` otherwise,
+     *                       If `name` is not passed or `undefiend`, `true` if any attribute is changed, `false` otherwise
+     **/
+    isAttributeChanged(name) {
+        const { changedAttributes } = this.state;
+        if (!name) {
+            // if name not specified return true if any attribute is changed
+            return !isObjectEmpty(changedAttributes);
+        }
+        return changedAttributes && changedAttributes[name] !== undefined;
+    }
+    // Private
+    // override Composite layer private method to create AttributeManager instance
+    _getAttributeManager() {
+        return new AttributeManager(this.context.gl, {
+            id: this.props.id,
+            stats: this.context.stats
+        });
+    }
+}
+AggregationLayer.layerName = 'AggregationLayer';
+// Helper methods
+// Returns true if given object is empty, false otherwise.
+function isObjectEmpty(obj) {
+    let isEmpty = true;
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    for (const key in obj) {
+        isEmpty = false;
+        break;
+    }
+    return isEmpty;
+}

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

@@ -1,39 +1,95 @@
-declare class ContourLayer extends GridAggregationLayer {
-    _updateAccessors(opts: any): void;
-    _resetResults(): void;
-    _generateContours(): void;
-    _updateThresholdData(props: any): void;
-}
-declare namespace ContourLayer {
-    export const layerName: string;
-    export { defaultProps };
-}
-export default ContourLayer;
-import GridAggregationLayer from "../grid-aggregation-layer";
-declare namespace defaultProps {
-    namespace cellSize {
-        const type: string;
-        const min: number;
-        const max: number;
-        const value: number;
-    }
-    namespace getPosition {
-        const type_1: string;
-        export { type_1 as type };
-        export function value_1(x: any): any;
-        export { value_1 as value };
-    }
-    namespace getWeight {
-        const type_2: string;
-        export { type_2 as type };
-        const value_2: number;
-        export { value_2 as value };
-    }
-    const gpuAggregation: boolean;
-    const aggregation: string;
-    const contours: {
-        threshold: number;
+import { Accessor, AccessorFunction, Color, Layer, Position, UpdateParameters } from '@deck.gl/core/typed';
+import GridAggregationLayer, { GridAggregationLayerProps } from '../grid-aggregation-layer';
+/** All properties supported by ContourLayer. */
+export declare type ContourLayerProps<DataT = any> = _ContourLayerProps<DataT> & GridAggregationLayerProps<DataT>;
+/** Properties added by ContourLayer. */
+export declare type _ContourLayerProps<DataT> = {
+    /**
+     * Size of each cell in meters.
+     * @default 1000
+     */
+    cellSize?: number;
+    /**
+     * When set to true, aggregation is performed on GPU, provided other conditions are met.
+     * @default true
+     */
+    gpuAggregation?: boolean;
+    /**
+     * Defines the type of aggregation operation, valid values are 'SUM', 'MEAN', 'MIN' and 'MAX'.
+     * @default 'SUM'
+     */
+    aggregation?: 'SUM' | 'MEAN' | 'MIN' | 'MAX';
+    /**
+     * 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;
     }[];
-    const zOffset: number;
+    /**
+     * A very small z offset that is added for each vertex of a contour (Isoline or Isoband).
+     * @default 0.005
+     */
+    zOffset?: number;
+    /**
+     * Method called to retrieve the position of each object.
+     * @default object => object.position
+     */
+    getPosition?: AccessorFunction<DataT, Position>;
+    /**
+     * The weight of each object.
+     * @default 1
+     */
+    getWeight?: Accessor<DataT, number>;
+};
+export default class ContourLayer<DataT = any, ExtraPropsT = {}> extends GridAggregationLayer<ExtraPropsT & Required<_ContourLayerProps<DataT>>> {
+    static layerName: string;
+    static defaultProps: {
+        cellSize: {
+            type: string;
+            min: number;
+            max: number;
+            value: number;
+        };
+        getPosition: {
+            type: string;
+            value: (x: any) => any;
+        };
+        getWeight: {
+            type: string;
+            value: number;
+        };
+        gpuAggregation: boolean;
+        aggregation: string;
+        contours: {
+            threshold: number;
+        }[];
+        zOffset: number;
+    };
+    initializeState(): void;
+    updateState(opts: UpdateParameters<this>): void;
+    renderLayers(): Layer[];
+    updateAggregationState(opts: any): void;
+    private _updateAccessors;
+    private _resetResults;
+    private _generateContours;
+    private _updateThresholdData;
 }
 //# sourceMappingURL=contour-layer.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"contour-layer.d.ts","sourceRoot":"","sources":["../../src/contour-layer/contour-layer.js"],"names":[],"mappings":"AA4DA;IAiKE,kCAQC;IAED,sBAKC;IAID,0BAoBC;IAED,uCAaC;CACF;;;;;;;;;;;;;;;;;QA/OwC,qCAAe"}
+{"version":3,"file":"contour-layer.d.ts","sourceRoot":"","sources":["../../src/contour-layer/contour-layer.ts"],"names":[],"mappings":"AAuBA,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,KAAK,EACL,KAAK,EAEL,QAAQ,EACR,gBAAgB,EACjB,MAAM,eAAe,CAAC;AAKvB,OAAO,oBAAoB,EAAE,EAAC,yBAAyB,EAAC,MAAM,2BAA2B,CAAC;AAgC1F,gDAAgD;AAChD,oBAAY,iBAAiB,CAAC,KAAK,GAAG,GAAG,IAAI,kBAAkB,CAAC,KAAK,CAAC,GACpE,yBAAyB,CAAC,KAAK,CAAC,CAAC;AAEnC,wCAAwC;AACxC,oBAAY,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;AACF,MAAM,CAAC,OAAO,OAAO,YAAY,CAAC,KAAK,GAAG,GAAG,EAAE,WAAW,GAAG,EAAE,CAAE,SAAQ,oBAAoB,CAC3F,WAAW,GAAG,QAAQ,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC,CAClD;IACC,MAAM,CAAC,SAAS,SAAkB;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;MAAgB;IAEnC,eAAe,IAAI,IAAI;IA2BvB,WAAW,CAAC,IAAI,EAAE,gBAAgB,CAAC,IAAI,CAAC,GAAG,IAAI;IAgB/C,YAAY,IAAI,KAAK,EAAE;IA4CvB,sBAAsB,CAAC,IAAI,KAAA;IAyE3B,OAAO,CAAC,gBAAgB;IAUxB,OAAO,CAAC,aAAa;IASrB,OAAO,CAAC,iBAAiB;IAsBzB,OAAO,CAAC,oBAAoB;CAc7B"}

package/typed/contour-layer/contour-layer.js

@@ -0,0 +1,234 @@
+// 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 GL from '@luma.gl/constants';
+import { LineLayer, SolidPolygonLayer } from '@deck.gl/layers';
+import { generateContours } from './contour-utils';
+import { log } from '@deck.gl/core';
+import GPUGridAggregator from '../utils/gpu-grid-aggregation/gpu-grid-aggregator';
+import { AGGREGATION_OPERATION, getValueFunc } from '../utils/aggregation-operation-utils';
+import { getBoundingBox, getGridParams } from '../utils/grid-aggregation-utils';
+import GridAggregationLayer from '../grid-aggregation-layer';
+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 },
+    getPosition: { type: 'accessor', value: x => x.position },
+    getWeight: { type: 'accessor', value: 1 },
+    gpuAggregation: true,
+    aggregation: 'SUM',
+    // contour lines
+    contours: [{ threshold: DEFAULT_THRESHOLD }],
+    zOffset: 0.005
+};
+const POSITION_ATTRIBUTE_NAME = 'positions';
+const DIMENSIONS = {
+    data: {
+        props: ['cellSize']
+    },
+    weights: {
+        props: ['aggregation'],
+        accessors: ['getWeight']
+    }
+};
+export default class ContourLayer extends GridAggregationLayer {
+    initializeState() {
+        super.initializeAggregationLayer({
+            dimensions: DIMENSIONS
+        });
+        this.setState({
+            contourData: {},
+            projectPoints: false,
+            weights: {
+                count: {
+                    size: 1,
+                    operation: AGGREGATION_OPERATION.SUM
+                }
+            }
+        });
+        const attributeManager = this.getAttributeManager();
+        attributeManager.add({
+            [POSITION_ATTRIBUTE_NAME]: {
+                size: 3,
+                accessor: 'getPosition',
+                type: GL.DOUBLE,
+                fp64: this.use64bitPositions()
+            },
+            // this attribute is used in gpu aggregation path only
+            count: { size: 3, accessor: 'getWeight' }
+        });
+    }
+    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);
+        }
+        if (this.getNumInstances() > 0 && (aggregationDirty || contoursChanged)) {
+            this._generateContours();
+        }
+    }
+    renderLayers() {
+        const { contourSegments, contourPolygons } = this.state.contourData;
+        const LinesSubLayerClass = this.getSubLayerClass('lines', LineLayer);
+        const BandsSubLayerClass = this.getSubLayerClass('bands', SolidPolygonLayer);
+        // Contour lines layer
+        const lineLayer = contourSegments &&
+            contourSegments.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
+            });
+        // Contour bands layer
+        const bandsLayer = contourPolygons &&
+            contourPolygons.length > 0 &&
+            new BandsSubLayerClass(this.getSubLayerProps({
+                id: 'bands'
+            }), {
+                data: this.state.contourData.contourPolygons,
+                getPolygon: d => d.vertices,
+                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.gl)) {
+                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(),
+                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) {
+            aggregationData = count.aggregationBuffer.getData();
+            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
+            };
+        }
+        this.setState({ thresholdData });
+    }
+}
+ContourLayer.layerName = 'ContourLayer';
+ContourLayer.defaultProps = defaultProps;

package/typed/contour-layer/contour-utils.d.ts

@@ -1,18 +1,17 @@
-export function generateContours({ thresholdData, colors, cellWeights, gridSize, gridOrigin, cellSize }: {
+export declare function generateContours({ thresholdData, cellWeights, gridSize, gridOrigin, cellSize }: {
     thresholdData: any;
-    colors: any;
-    cellWeights: any;
-    gridSize: any;
-    gridOrigin: any;
-    cellSize: any;
+    cellWeights: Float32Array;
+    gridSize: number[];
+    gridOrigin: number[];
+    cellSize: number[];
 }): {
     contourSegments: {
-        start: any;
-        end: any;
+        start: number[];
+        end: number[];
         contour: any;
     }[];
     contourPolygons: {
-        vertices: any;
+        vertices: number[][];
         contour: any;
     }[];
 };

package/typed/contour-layer/contour-utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"contour-utils.d.ts","sourceRoot":"","sources":["../../src/contour-layer/contour-utils.js"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;EAiEC"}
+{"version":3,"file":"contour-utils.d.ts","sourceRoot":"","sources":["../../src/contour-layer/contour-utils.ts"],"names":[],"mappings":"AAIA,wBAAgB,gBAAgB,CAAC,EAC/B,aAAa,EACb,WAAW,EACX,QAAQ,EACR,UAAU,EACV,QAAQ,EACT,EAAE;IACD,aAAa,EAAE,GAAG,CAAC;IACnB,WAAW,EAAE,YAAY,CAAC;IAC1B,QAAQ,EAAE,MAAM,EAAE,CAAC;IACnB,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,QAAQ,EAAE,MAAM,EAAE,CAAC;CACpB;;eACgC,MAAM,EAAE;aAAO,MAAM,EAAE;iBAAW,GAAG;;;kBAClC,MAAM,EAAE,EAAE;iBAAW,GAAG;;EAyD3D"}

package/typed/contour-layer/contour-utils.js

@@ -0,0 +1,64 @@
+import { getCode, getVertices, CONTOUR_TYPE } from './marching-squares';
+// Given all the cell weights, generates contours for each threshold.
+/* eslint-disable max-depth */
+export function generateContours({ thresholdData, cellWeights, gridSize, gridOrigin, cellSize }) {
+    const contourSegments = [];
+    const contourPolygons = [];
+    const width = gridSize[0];
+    const height = gridSize[1];
+    let segmentIndex = 0;
+    let polygonIndex = 0;
+    for (const data of thresholdData) {
+        const { contour } = data;
+        const { threshold } = contour;
+        for (let x = -1; x < width; x++) {
+            for (let y = -1; y < height; y++) {
+                // Get the MarchingSquares code based on neighbor cell weights.
+                const { code, meanCode } = getCode({
+                    cellWeights,
+                    threshold,
+                    x,
+                    y,
+                    width,
+                    height
+                });
+                const opts = {
+                    type: CONTOUR_TYPE.ISO_BANDS,
+                    gridOrigin,
+                    cellSize,
+                    x,
+                    y,
+                    width,
+                    height,
+                    code,
+                    meanCode,
+                    thresholdData: data
+                };
+                if (Array.isArray(threshold)) {
+                    opts.type = CONTOUR_TYPE.ISO_BANDS;
+                    const polygons = getVertices(opts);
+                    for (const polygon of polygons) {
+                        contourPolygons[polygonIndex++] = {
+                            vertices: polygon,
+                            contour
+                        };
+                    }
+                }
+                else {
+                    // Get the intersection vertices based on MarchingSquares code.
+                    opts.type = CONTOUR_TYPE.ISO_LINES;
+                    const vertices = getVertices(opts);
+                    for (let i = 0; i < vertices.length; i += 2) {
+                        contourSegments[segmentIndex++] = {
+                            start: vertices[i],
+                            end: vertices[i + 1],
+                            contour
+                        };
+                    }
+                }
+            }
+        }
+    }
+    return { contourSegments, contourPolygons };
+}
+/* eslint-enable max-depth */