@deck.gl/aggregation-layers 9.0.0-beta.5 → 9.0.0-beta.6

package/package.json

@@ -3,7 +3,7 @@
   "description": "deck.gl layers that aggregate the input data into alternative representations",
   "license": "MIT",
   "type": "module",
-  "version": "9.0.0-beta.5",
+  "version": "9.0.0-beta.6",
   "publishConfig": {
     "access": "public"
   },
@@ -39,17 +39,17 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
-    "@luma.gl/constants": "9.0.0-beta.4",
-    "@luma.gl/core": "9.0.0-beta.4",
-    "@luma.gl/shadertools": "9.0.0-beta.4",
+    "@luma.gl/constants": "9.0.0-beta.6",
+    "@luma.gl/core": "9.0.0-beta.6",
+    "@luma.gl/shadertools": "9.0.0-beta.6",
     "@math.gl/web-mercator": "^4.0.0",
     "d3-hexbin": "^0.2.1"
   },
   "peerDependencies": {
     "@deck.gl/core": "^9.0.0-alpha",
     "@deck.gl/layers": "^9.0.0-alpha",
-    "@luma.gl/core": "9.0.0-beta.4",
-    "@luma.gl/engine": "9.0.0-beta.4"
+    "@luma.gl/core": "9.0.0-beta.6",
+    "@luma.gl/engine": "9.0.0-beta.6"
   },
-  "gitHead": "02588aba7cbf25d48cec20b30a686bba9be32bff"
+  "gitHead": "373729308eb3fdec4b7c8b5842ddeff4f2d70338"
 }

package/src/contour-layer/contour-layer.ts

@@ -18,7 +18,6 @@
 // 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 {
@@ -185,7 +184,7 @@ export default class ContourLayer<
       [POSITION_ATTRIBUTE_NAME]: {
         size: 3,
         accessor: 'getPosition',
-        type: GL.DOUBLE,
+        type: 'float64',
         fp64: this.use64bitPositions()
       },
       // this attribute is used in gpu aggregation path only
@@ -351,7 +350,7 @@ export default class ContourLayer<
     let {aggregationData} = count;
     if (!aggregationData) {
       // @ts-ignore
-      aggregationData = count.aggregationBuffer!.readSyncWebGL2() as Float32Array;
+      aggregationData = count.aggregationBuffer!.readSyncWebGL() as Float32Array;
       count.aggregationData = aggregationData;
     }
 

package/src/cpu-grid-layer/cpu-grid-layer.ts

@@ -18,7 +18,6 @@
 // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 // THE SOFTWARE.
 
-import {GL} from '@luma.gl/constants';
 import {GridCellLayer} from '@deck.gl/layers';
 import {Accessor, AccessorFunction, Color, Position, Material, DefaultProps} from '@deck.gl/core';
 
@@ -261,7 +260,7 @@ export default class CPUGridLayer<
     };
     const attributeManager = this.getAttributeManager()!;
     attributeManager.add({
-      positions: {size: 3, type: GL.DOUBLE, accessor: 'getPosition'}
+      positions: {size: 3, type: 'float64', accessor: 'getPosition'}
     });
     // color and elevation attributes can't be added as attributes
     // they are calcualted using 'getValue' accessor that takes an array of pints.

package/src/gpu-grid-layer/gpu-grid-cell-layer.ts

@@ -192,7 +192,7 @@ export default class GPUGridCellLayer extends Layer<_GPUGridCellLayerProps> {
     // @ts-expect-error TODO v9 This code is not portable to WebGPU
     const programHandle = model.pipeline.handle;
 
-    const gl = this.context.gl as WebGL2RenderingContext;
+    const gl = this.context.gl;
     const colorIndex = gl.getUniformBlockIndex(programHandle, 'ColorData');
     const elevationIndex = gl.getUniformBlockIndex(programHandle, 'ElevationData');
     gl.uniformBlockBinding(programHandle, colorIndex, COLOR_DATA_UBO_INDEX);

package/src/gpu-grid-layer/gpu-grid-layer.ts

@@ -167,7 +167,7 @@ export type _GPUGridLayerProps<DataT> = {
   getElevationWeight?: Accessor<DataT, number>;
 };
 
-/** Aggregate data into a grid-based heatmap. Aggregation is performed on GPU (WebGL2 only). */
+/** Aggregate data into a grid-based heatmap. Aggregation is performed on GPU. */
 export default class GPUGridLayer<
   DataT = any,
   ExtraPropsT extends {} = {}
@@ -221,7 +221,7 @@ export default class GPUGridLayer<
       [POSITION_ATTRIBUTE_NAME]: {
         size: 3,
         accessor: 'getPosition',
-        type: GL.DOUBLE,
+        type: 'float64',
         fp64: this.use64bitPositions()
       },
       color: {size: 3, accessor: 'getColorWeight'},

package/src/heatmap-layer/heatmap-layer.ts

@@ -27,7 +27,6 @@ import {
   getTextureCoordinates
 } from './heatmap-layer-utils';
 import {Buffer, DeviceFeature, Texture, TextureProps, TextureFormat} from '@luma.gl/core';
-import {GL} from '@luma.gl/constants';
 import {TextureTransform, TextureTransformProps} from '@luma.gl/engine';
 import {
   Accessor,
@@ -83,14 +82,9 @@ const defaultProps: DefaultProps<HeatmapLayerProps> = {
   debounceTimeout: {type: 'number', min: 0, max: 1000, value: 500}
 };
 
-const REQUIRED_FEATURES: DeviceFeature[] = [
-  'blend-minmax-webgl1', // max weight calculation
-  'texture-formats-float32-webgl1' // weight-map as texture
-];
-
 const FLOAT_TARGET_FEATURES: DeviceFeature[] = [
-  'texture-renderable-float32-webgl', // ability to render to float texture
-  'texture-blend-float-webgl1' // ability to blend when rendering to float texture
+  'float32-renderable-webgl', // ability to render to float texture
+  'texture-blend-float-webgl' // ability to blend when rendering to float texture
 ];
 
 const DIMENSIONS = {
@@ -187,7 +181,6 @@ export default class HeatmapLayer<
   static defaultProps = defaultProps;
 
   state!: AggregationLayer<DataT>['state'] & {
-    supported: boolean;
     colorDomain?: number[];
     isWeightMapDirty?: boolean;
     weightsTexture?: Texture;
@@ -209,13 +202,8 @@ export default class HeatmapLayer<
   };
 
   initializeState() {
-    if (!REQUIRED_FEATURES.every(feature => this.context.device.features.has(feature))) {
-      this.setState({supported: false});
-      log.error(`HeatmapLayer: ${this.id} is not supported on this browser`)();
-      return;
-    }
     super.initializeAggregationLayer(DIMENSIONS);
-    this.setState({supported: true, colorDomain: DEFAULT_COLOR_DOMAIN});
+    this.setState({colorDomain: DEFAULT_COLOR_DOMAIN});
     this._setupTextureParams();
     this._setupAttributes();
     this._setupResources();
@@ -228,9 +216,6 @@ export default class HeatmapLayer<
 
   /* eslint-disable max-statements,complexity */
   updateState(opts: UpdateParameters<this>) {
-    if (!this.state.supported) {
-      return;
-    }
     super.updateState(opts);
     this._updateHeatmapState(opts);
   }
@@ -266,9 +251,6 @@ export default class HeatmapLayer<
   }
 
   renderLayers(): LayersList | Layer {
-    if (!this.state.supported) {
-      return [];
-    }
     const {
       weightsTexture,
       triPositionBuffer,
@@ -387,7 +369,7 @@ export default class HeatmapLayer<
   _setupAttributes() {
     const attributeManager = this.getAttributeManager()!;
     attributeManager.add({
-      positions: {size: 3, type: GL.DOUBLE, accessor: 'getPosition'},
+      positions: {size: 3, type: 'float64', accessor: 'getPosition'},
       weights: {size: 1, accessor: 'getWeight'}
     });
     this.setState({positionAttributeName: 'positions'});
@@ -397,7 +379,7 @@ export default class HeatmapLayer<
     const {device} = this.context;
     const {weightsTextureSize} = this.props;
 
-    const textureSize = Math.min(weightsTextureSize, device.limits.maxTextureDimension2D as number);
+    const textureSize = Math.min(weightsTextureSize, device.limits.maxTextureDimension2D);
     const floatTargetSupport = FLOAT_TARGET_FEATURES.every(feature => device.features.has(feature));
     const format: TextureFormat = floatTargetSupport ? 'rgba32float' : 'rgba8unorm';
     const weightsScale = floatTargetSupport ? 1 : 1 / 255;

package/src/hexagon-layer/hexagon-layer.ts

@@ -29,7 +29,6 @@ import {
   DefaultProps
 } from '@deck.gl/core';
 import {ColumnLayer} from '@deck.gl/layers';
-import {GL} from '@luma.gl/constants';
 
 import {defaultColorRange} from '../utils/color-utils';
 
@@ -249,7 +248,7 @@ type _HexagonLayerProps<DataT = unknown> = {
 /** Aggregates data into a hexagon-based heatmap. The color and height of a hexagon are determined based on the objects it contains. */
 export default class HexagonLayer<DataT, ExtraPropsT extends {} = {}> extends AggregationLayer<
   DataT,
-  ExtraPropsT & Required<_HexagonLayerProps>
+  ExtraPropsT & Required<_HexagonLayerProps<DataT>>
 > {
   static layerName = 'HexagonLayer';
   static defaultProps = defaultProps;
@@ -272,7 +271,7 @@ export default class HexagonLayer<DataT, ExtraPropsT extends {} = {}> extends Ag
     };
     const attributeManager = this.getAttributeManager()!;
     attributeManager.add({
-      positions: {size: 3, type: GL.DOUBLE, accessor: 'getPosition'}
+      positions: {size: 3, type: 'float64', accessor: 'getPosition'}
     });
     // color and elevation attributes can't be added as attributes
     // they are calculated using 'getValue' accessor that takes an array of pints.

package/src/screen-grid-layer/screen-grid-cell-layer.ts

@@ -54,10 +54,6 @@ export default class ScreenGridCellLayer<DataT = any, ExtraPropsT extends {} = {
   static layerName = 'ScreenGridCellLayer';
   static defaultProps = defaultProps;
 
-  static isSupported(device: Device) {
-    return device.features.has('texture-formats-float32-webgl1');
-  }
-
   state!: {
     model?: Model;
   };

package/src/screen-grid-layer/screen-grid-layer.ts

@@ -32,7 +32,6 @@ import {
   DefaultProps
 } from '@deck.gl/core';
 import type {Buffer, Texture} from '@luma.gl/core';
-import {GL} from '@luma.gl/constants';
 import GPUGridAggregator from '../utils/gpu-grid-aggregation/gpu-grid-aggregator';
 import {AGGREGATION_OPERATION, getValueFunc} from '../utils/aggregation-operation-utils';
 import ScreenGridCellLayer from './screen-grid-cell-layer';
@@ -121,9 +120,6 @@ export type _ScreenGridLayerProps<DataT> = {
   /**
    * Perform aggregation is performed on GPU.
    *
-   * NOTE: GPU Aggregation requires WebGL2 support by the browser.
-   * When `gpuAggregation` is set to true and browser doesn't support WebGL2, aggregation falls back to CPU.
-   *
    * @default true
    */
   gpuAggregation?: boolean;
@@ -157,12 +153,6 @@ export default class ScreenGridLayer<
   };
 
   initializeState() {
-    if (!ScreenGridCellLayer.isSupported(this.context.device)) {
-      // max aggregated value is sampled from a float texture
-      this.setState({supported: false});
-      log.error(`ScreenGridLayer: ${this.id} is not supported on this browser`)();
-      return;
-    }
     super.initializeAggregationLayer({
       dimensions: DIMENSIONS,
       // @ts-expect-error
@@ -191,7 +181,7 @@ export default class ScreenGridLayer<
       [POSITION_ATTRIBUTE_NAME]: {
         size: 3,
         accessor: 'getPosition',
-        type: GL.DOUBLE,
+        type: 'float64',
         fp64: this.use64bitPositions()
       },
       // this attribute is used in gpu aggregation path only

package/src/utils/gpu-grid-aggregation/gpu-grid-aggregator.ts

@@ -51,11 +51,8 @@ const ARRAY_BUFFER_MAP = {
 };
 
 const REQUIRED_FEATURES: DeviceFeature[] = [
-  'webgl2',
-  'blend-minmax-webgl1',
-  'texture-renderable-float32-webgl',
-  'texture-blend-float-webgl1',
-  'texture-formats-float32-webgl1'
+  'float32-renderable-webgl',
+  'texture-blend-float-webgl'
 ];
 
 export type GPUGridAggregatorProps = {
@@ -179,15 +176,10 @@ export default class GPUGridAggregator {
     this.device = device;
 
     const REQUIRED_FEATURES: DeviceFeature[] = [
-      'blend-minmax-webgl1', // set min/max blend modes
-      'texture-renderable-float32-webgl', // render to float texture
-      'texture-formats-float32-webgl1' // sample from a float texture
+      'float32-renderable-webgl' // render to float texture
     ];
 
-    // gl_InstanceID usage in min/max calculation shaders
-    this._hasGPUSupport =
-      this.device.info.type === 'webgl2' &&
-      REQUIRED_FEATURES.every(feature => device.features.has(feature));
+    this._hasGPUSupport = REQUIRED_FEATURES.every(feature => device.features.has(feature));
     if (this._hasGPUSupport) {
       this._setupModels();
     }
@@ -226,9 +218,6 @@ export default class GPUGridAggregator {
     // reset results
     this.setState({results: {}});
     const aggregationParams = this._normalizeAggregationParams(opts);
-    if (!this._hasGPUSupport) {
-      log.log(1, 'GPUGridAggregator: not supported')();
-    }
     return this._runAggregation(aggregationParams);
   }