Binary attribute support

examples/experimental/interleaved-buffer/app.js

@@ -1,7 +1,6 @@
 import {Deck, OrthographicView} from '@deck.gl/core';
 import {ScatterplotLayer, PathLayer, SolidPolygonLayer} from '@deck.gl/layers';
-import GL from '@luma.gl/constants';
-import {Buffer} from '@luma.gl/core';
+import {GL} from '@luma.gl/constants';
 
 import data from './data';
 
@@ -14,11 +13,11 @@ const deck = new Deck({
     target: [6, 6, 0],
     zoom: 5
   },
-  onWebGLInitialized
+  onDeviceInitialized
 });
 
-function onWebGLInitialized(gl) {
-  const buffer = new Buffer(gl, data);
+function onDeviceInitialized(device) {
+  const buffer = device.createBuffer({data});
 
   const positions = {buffer, type: GL.FLOAT, size: 3, offset: 4, stride: 16};
   const colors = {buffer, type: GL.UNSIGNED_BYTE, size: 4, offset: 0, stride: 16};
@@ -38,8 +37,7 @@ function onWebGLInitialized(gl) {
       },
       pickable: true,
       autoHighlight: true,
-      _normalize: false, // this instructs SolidPolygonLayer to skip normalization and use the binary as is
-      getWidth: 0.5
+      _normalize: false // this instructs SolidPolygonLayer to skip normalization and use the binary as is
     }),
 
     new PathLayer({

modules/aggregation-layers/package.json

@@ -31,17 +31,17 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
-    "@luma.gl/constants": "9.0.0-alpha.36",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/shadertools": "9.0.0-alpha.36",
+    "@luma.gl/constants": "9.0.0-alpha.37",
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/shadertools": "9.0.0-alpha.37",
     "@math.gl/web-mercator": "4.0.0-alpha.4",
     "d3-hexbin": "^0.2.1"
   },
   "peerDependencies": {
     "@deck.gl/core": "^8.0.0",
     "@deck.gl/layers": "^8.0.0",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/engine": "9.0.0-alpha.36"
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/engine": "9.0.0-alpha.37"
   },
   "gitHead": "13ace64fc2cee08c133afc882fc307253489a4e4"
 }

modules/arcgis/package.json

@@ -32,8 +32,8 @@
   "peerDependencies": {
     "@arcgis/core": "^4.0.0",
     "@deck.gl/core": "^8.0.0",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/engine": "9.0.0-alpha.36"
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/engine": "9.0.0-alpha.37"
   },
   "dependencies": {
     "@babel/runtime": "^7.0.0",

modules/carto/package.json

@@ -39,7 +39,7 @@
     "@loaders.gl/loader-utils": "^3.4.13",
     "@loaders.gl/mvt": "^3.4.13",
     "@loaders.gl/tiles": "^3.4.13",
-    "@luma.gl/core": "9.0.0-alpha.36",
+    "@luma.gl/core": "9.0.0-alpha.37",
     "@luma.gl/constants": "^8.5.20",
     "@math.gl/web-mercator": "4.0.0-alpha.4",
     "cartocolor": "^4.0.2",

modules/core/package.json

@@ -38,11 +38,11 @@
     "@babel/runtime": "^7.0.0",
     "@loaders.gl/core": "^3.4.13",
     "@loaders.gl/images": "^3.4.13",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/constants": "9.0.0-alpha.36",
-    "@luma.gl/engine": "9.0.0-alpha.36",
-    "@luma.gl/shadertools": "9.0.0-alpha.36",
-    "@luma.gl/webgl": "9.0.0-alpha.36",
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/constants": "9.0.0-alpha.37",
+    "@luma.gl/engine": "9.0.0-alpha.37",
+    "@luma.gl/shadertools": "9.0.0-alpha.37",
+    "@luma.gl/webgl": "9.0.0-alpha.37",
     "@math.gl/core": "4.0.0-alpha.4",
     "@math.gl/sun": "4.0.0-alpha.4",
     "@math.gl/web-mercator": "4.0.0-alpha.4",

modules/core/src/lib/attribute/attribute.ts

@@ -1,9 +1,15 @@
 /* eslint-disable complexity */
-import DataColumn, {DataColumnOptions, ShaderAttributeOptions, BufferAccessor} from './data-column';
+import DataColumn, {
+  DataColumnOptions,
+  ShaderAttributeOptions,
+  BufferAccessor,
+  DataColumnSettings
+} from './data-column';
 import assert from '../../utils/assert';
 import {createIterable, getAccessorFromBuffer} from '../../utils/iterable-utils';
 import {fillArray} from '../../utils/flatten';
 import * as range from '../../utils/range';
+import {bufferLayoutEqual} from './gl-utils';
 import {normalizeTransitionSettings, TransitionSettings} from './attribute-transition-utils';
 import type {Device, Buffer, BufferLayout} from '@luma.gl/core';
 
@@ -55,6 +61,7 @@ type AttributeInternalState = {
   binaryAccessor: Accessor<any, any> | null;
   needsUpdate: string | boolean;
   needsRedraw: string | boolean;
+  layoutChanged: boolean;
   updateRanges: number[][];
 };
 
@@ -70,6 +77,7 @@ export default class Attribute extends DataColumn<AttributeOptions, AttributeInt
       binaryAccessor: null,
       needsUpdate: true,
       needsRedraw: false,
+      layoutChanged: false,
       updateRanges: range.FULL
     });
 
@@ -101,6 +109,15 @@ export default class Attribute extends DataColumn<AttributeOptions, AttributeInt
     return needsRedraw;
   }
 
+  layoutChanged(): boolean {
+    return this.state.layoutChanged;
+  }
+
+  setAccessor(accessor: DataColumnSettings<AttributeOptions>) {
+    this.state.layoutChanged ||= !bufferLayoutEqual(accessor, this.getAccessor());
+    super.setAccessor(accessor);
+  }
+
   getUpdateTriggers(): string[] {
     const {accessor} = this.settings;
 
@@ -345,6 +362,9 @@ export default class Attribute extends DataColumn<AttributeOptions, AttributeInt
   }
 
   getBufferLayout(): BufferLayout {
+    // Clear change flag
+    this.state.layoutChanged = false;
+
     const shaderAttributeDefs = this.settings.shaderAttributes;
     const result: BufferLayout = super.getBufferLayout();
 

modules/core/src/lib/attribute/data-column.ts

@@ -99,7 +99,7 @@ export type DataColumnOptions<Options> = Options &
     defaultValue?: number | number[];
   };
 
-type DataColumnSettings<Options> = DataColumnOptions<Options> & {
+export type DataColumnSettings<Options> = DataColumnOptions<Options> & {
   type: number;
   size: number;
   logicalType?: number;
@@ -296,6 +296,10 @@ export default class DataColumn<Options, State> {
     return result;
   }
 
+  setAccessor(accessor: DataColumnSettings<Options>) {
+    this.state.bufferAccessor = accessor;
+  }
+
   getAccessor(): DataColumnSettings<Options> {
     return this.state.bufferAccessor;
   }
@@ -358,7 +362,6 @@ export default class DataColumn<Options, State> {
     }
 
     const accessor: DataColumnSettings<Options> = {...this.settings, ...opts};
-    state.bufferAccessor = accessor;
     state.bounds = null; // clear cached bounds
 
     if (opts.constant) {
@@ -400,11 +403,19 @@ export default class DataColumn<Options, State> {
       accessor.bytesPerElement = value.BYTES_PER_ELEMENT;
       accessor.stride = getStride(accessor);
 
-      const {buffer, byteOffset} = this;
+      const {buffer} = this;
+      const byteOffset = (accessor.vertexOffset || 0) * getStride(accessor);
 
       if (this.doublePrecision && value instanceof Float64Array) {
         value = toDoublePrecisionArray(value, accessor);
       }
+      if (this.settings.isIndexed) {
+        const ArrayType = this.settings.defaultType;
+        if (value.constructor !== ArrayType) {
+          // Cast the index buffer to expected type
+          value = new ArrayType(value);
+        }
+      }
 
       // A small over allocation is used as safety margin
       // Shader attributes may try to access this buffer with bigger offsets
@@ -419,6 +430,8 @@ export default class DataColumn<Options, State> {
       accessor.type = opts.type || buffer.accessor.type;
     }
 
+    this.setAccessor(accessor);
+
     return true;
   }
 
@@ -478,7 +491,7 @@ export default class DataColumn<Options, State> {
     state.allocatedValue = value;
     state.constant = false;
     state.externalBuffer = null;
-    state.bufferAccessor = this.settings;
+    this.setAccessor(this.settings);
     return true;
   }
 

modules/core/src/lib/attribute/gl-utils.ts

@@ -61,3 +61,12 @@ export function getBufferAttributeLayout(
     // Note stride is set on the top level
   };
 }
+
+export function bufferLayoutEqual(accessor1: BufferAccessor, accessor2: BufferAccessor) {
+  return (
+    (accessor1.type ?? GL.FLOAT) === (accessor2.type ?? GL.FLOAT) &&
+    accessor1.size === accessor2.size &&
+    accessor1.stride === accessor2.stride &&
+    (accessor1.offset || 0) === (accessor2.offset || 0)
+  );
+}

modules/core/src/lib/layer.ts

@@ -634,8 +634,16 @@ export default abstract class Layer<PropsT extends {} = {}> extends Component<
 
   /** Send updated attributes to the WebGL model */
   protected updateAttributes(changedAttributes: {[id: string]: Attribute}) {
+    // If some buffer layout changed
+    let bufferLayoutChanged = false;
+    for (const id in changedAttributes) {
+      if (changedAttributes[id].layoutChanged()) {
+        bufferLayoutChanged = true;
+      }
+    }
+
     for (const model of this.getModels()) {
-      this._setModelAttributes(model, changedAttributes);
+      this._setModelAttributes(model, changedAttributes, bufferLayoutChanged);
     }
   }
 
@@ -739,12 +747,20 @@ export default abstract class Layer<PropsT extends {} = {}> extends Component<
     model: Model,
     changedAttributes: {
       [id: string]: Attribute;
-    }
+    },
+    bufferLayoutChanged = false
   ) {
     if (!Object.keys(changedAttributes).length) {
       return;
     }
 
+    if (bufferLayoutChanged) {
+      const attributeManager = this.getAttributeManager();
+      model.setBufferLayout(attributeManager.getBufferLayouts());
+      // All attributes must be reset after buffer layout change
+      changedAttributes = attributeManager.getAttributes();
+    }
+
     // @ts-ignore luma.gl type issue
     const excludeAttributes = model.userData?.excludeAttributes || {};
     const attributeBuffers: Record<string, Buffer> = {};

modules/core/src/utils/tesselator.ts

@@ -105,10 +105,10 @@ export default abstract class Tesselator<GeometryT, NormalizedGeometryT, ExtraOp
       if (!normalize) {
         // skip packing and set attribute value directly
         // TODO - avoid mutating user-provided object
-        buffers.positions = geometryBuffer;
+        buffers.vertexPositions = geometryBuffer;
       }
     }
-    this.geometryBuffer = buffers.positions;
+    this.geometryBuffer = buffers.vertexPositions;
 
     if (Array.isArray(dataChanged)) {
       // is partial update

modules/extensions/package.json

@@ -31,15 +31,15 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.0.0",
-    "@luma.gl/shadertools": "9.0.0-alpha.36"
+    "@luma.gl/shadertools": "9.0.0-alpha.37"
   },
   "peerDependencies": {
     "@deck.gl/core": "^8.0.0",
-    "@luma.gl/constants": "9.0.0-alpha.36",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/engine": "9.0.0-alpha.36",
-    "@luma.gl/shadertools": "9.0.0-alpha.36",
-    "@luma.gl/webgl": "9.0.0-alpha.36",
+    "@luma.gl/constants": "9.0.0-alpha.37",
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/engine": "9.0.0-alpha.37",
+    "@luma.gl/shadertools": "9.0.0-alpha.37",
+    "@luma.gl/webgl": "9.0.0-alpha.37",
     "@math.gl/core": "4.0.0-alpha.4",
     "@math.gl/constants": "4.0.0-alpha.4",
     "@math.gl/web-mercator": "4.0.0-alpha.4",

modules/geo-layers/package.json

@@ -39,7 +39,7 @@
     "@loaders.gl/terrain": "^3.4.13",
     "@loaders.gl/tiles": "^3.4.13",
     "@loaders.gl/wms": "^3.4.13",
-    "@luma.gl/core": "9.0.0-alpha.36",
+    "@luma.gl/core": "9.0.0-alpha.37",
     "@math.gl/core": "4.0.0-alpha.4",
     "@math.gl/culling": "4.0.0-alpha.4",
     "@math.gl/web-mercator": "4.0.0-alpha.4",
@@ -53,8 +53,8 @@
     "@deck.gl/layers": "^8.0.0",
     "@deck.gl/mesh-layers": "^8.0.0",
     "@loaders.gl/core": "^3.4.13",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/shadertools": "9.0.0-alpha.36"
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/shadertools": "9.0.0-alpha.37"
   },
   "gitHead": "13ace64fc2cee08c133afc882fc307253489a4e4"
 }

modules/google-maps/package.json

@@ -37,10 +37,10 @@
   },
   "peerDependencies": {
     "@deck.gl/core": "^8.0.0",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/engine": "9.0.0-alpha.36",
-    "@luma.gl/webgl": "9.0.0-alpha.36",
-    "@luma.gl/constants": "9.0.0-alpha.36",
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/engine": "9.0.0-alpha.37",
+    "@luma.gl/webgl": "9.0.0-alpha.37",
+    "@luma.gl/constants": "9.0.0-alpha.37",
     "@math.gl/core": "4.0.0-alpha.4"
   },
   "gitHead": "13ace64fc2cee08c133afc882fc307253489a4e4"

modules/jupyter-widget/package.json

@@ -39,7 +39,7 @@
     "@loaders.gl/3d-tiles": "^3.4.13",
     "@loaders.gl/core": "^3.4.13",
     "@loaders.gl/csv": "^3.4.13",
-    "@luma.gl/core": "9.0.0-alpha.36",
+    "@luma.gl/core": "9.0.0-alpha.37",
     "mapbox-gl": "^1.13.2"
   },
   "jupyterlab": {

modules/layers/package.json

@@ -32,10 +32,10 @@
     "@babel/runtime": "^7.0.0",
     "@loaders.gl/images": "^3.4.13",
     "@loaders.gl/schema": "^3.4.13",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/engine": "9.0.0-alpha.36",
-    "@luma.gl/shadertools": "9.0.0-alpha.36",
-    "@luma.gl/constants": "9.0.0-alpha.36",
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/engine": "9.0.0-alpha.37",
+    "@luma.gl/shadertools": "9.0.0-alpha.37",
+    "@luma.gl/constants": "9.0.0-alpha.37",
     "@mapbox/tiny-sdf": "^2.0.5",
     "@math.gl/core": "4.0.0-alpha.4",
     "@math.gl/polygon": "4.0.0-alpha.4",
@@ -45,9 +45,9 @@
   "peerDependencies": {
     "@deck.gl/core": "^8.0.0",
     "@loaders.gl/core": "^3.4.13",
-    "@luma.gl/core": "9.0.0-alpha.36",
-    "@luma.gl/engine": "9.0.0-alpha.36",
-    "@luma.gl/shadertools": "9.0.0-alpha.36"
+    "@luma.gl/core": "9.0.0-alpha.37",
+    "@luma.gl/engine": "9.0.0-alpha.37",
+    "@luma.gl/shadertools": "9.0.0-alpha.37"
   },
   "gitHead": "13ace64fc2cee08c133afc882fc307253489a4e4"
 }

modules/layers/src/path-layer/path-layer.ts

@@ -163,7 +163,7 @@ export default class PathLayer<DataT = any, ExtraPropsT extends {} = {}> extends
     const attributeManager = this.getAttributeManager();
     /* eslint-disable max-len */
     attributeManager.addInstanced({
-      instancePositions: {
+      vertexPositions: {
         size: 3,
         // Start filling buffer from 1 vertex in
         vertexOffset: 1,