feat(engine) Support normalized attributes in GPUGeometry (#1894)

Author: felixpalmer

modules/core/src/adapter/type-utils/vertex-format-from-attribute.ts

@@ -6,6 +6,8 @@ import {VertexFormat} from '../types/vertex-formats';
 // type Omit<DataType, 'float16'> unfortunately breaks Typescript inferance
 type DataType = 'uint8' | 'sint8' | 'uint16' | 'sint16' | 'uint32' | 'sint32' | 'float32';
 
+type DataTypeNorm = 'unorm8' | 'snorm8'| 'unorm16' | 'snorm16';
+
 export function getDataTypeFromTypedArray(arrayOrType: TypedArray | TypedArrayConstructor): DataType {
   const type = ArrayBuffer.isView(arrayOrType) ? arrayOrType.constructor : arrayOrType;
   switch (type) {
@@ -53,26 +55,32 @@ export function getTypedArrayFromDataType(dataType: DataType): TypedArrayConstru
 }
 
 /** Get the vertex format for an attribute with TypedArray and size */
-export function getVertexFormatFromAttribute(typedArray: TypedArray, size?: number): VertexFormat {
+export function getVertexFormatFromAttribute(typedArray: TypedArray, size: number, normalized?: boolean): VertexFormat {
   if(!size || size > 4) {
     throw new Error(`size ${size}`);
   }
 
   const components = size as 1 | 2 | 3 | 4;
-  const dataType: DataType = getDataTypeFromTypedArray(typedArray);
+  let dataType: DataType | DataTypeNorm = getDataTypeFromTypedArray(typedArray);
 
   if (dataType === 'uint8' || dataType === 'sint8') {
     if (components === 1 || components === 3) {
       // WebGPU 8 bit formats must be aligned to 16 bit boundaries');
       throw new Error(`size: ${size}`);
     }
+    if (normalized) {
+      dataType = dataType.replace('int', 'norm') as 'unorm8' | 'snorm8';
+    }
     return `${dataType}x${components}`;
   }
   if (dataType === 'uint16' || dataType === 'sint16') {
     if (components === 1 || components === 3) {
       // WebGPU 16 bit formats must be aligned to 32 bit boundaries
       throw new Error(`size: ${size}`);
     }
+    if (normalized) {
+      dataType = dataType.replace('int', 'norm') as 'unorm16' | 'snorm16';
+    }
     return `${dataType}x${components}`;
   }
 

modules/core/test/adapter/type-utils/vertex-format-from-attribute.spec.ts

@@ -3,7 +3,7 @@ import test from 'tape-promise/tape';
 import {VertexFormat, getDataTypeFromTypedArray, getTypedArrayFromDataType, getVertexFormatFromAttribute} from '@luma.gl/core';
 import type {TypedArray, TypedArrayConstructor} from '@luma.gl/core';
 
-const TEST_CASES: {typedArray: TypedArray, size?: number, result?: VertexFormat, error?: string}[] = [
+const TEST_CASES: {typedArray: TypedArray, size?: number, normalized?: boolean, result?: VertexFormat, error?: string}[] = [
   {typedArray: new Uint8Array(), size: 4, result: 'uint8x4'},
   {typedArray: new Uint8ClampedArray(), size: 2, result: 'uint8x2'},
   {typedArray: new Int8Array(), size: 4, result: 'sint8x4'},
@@ -15,6 +15,12 @@ const TEST_CASES: {typedArray: TypedArray, size?: number, result?: VertexFormat,
   {typedArray: new Float32Array(), size: 3, result: 'float32x3'},
   {typedArray: new Float32Array(), size: 4, result: 'float32x4'},
 
+  {typedArray: new Uint8Array(), size: 2, normalized: true, result: 'unorm8x2'},
+  {typedArray: new Uint8ClampedArray(), size: 4, normalized: true, result: 'unorm8x4'},
+  {typedArray: new Int8Array(), size: 2, normalized: true, result: 'snorm8x2'},
+  {typedArray: new Uint16Array(), size: 2, normalized: true, result: 'unorm16x2'},
+  {typedArray: new Int16Array(), size: 4, normalized: true, result: 'snorm16x4'},
+
   {typedArray: new Float32Array(), size: 5, error: 'Invalid attribute size 5'},
   {typedArray: new Int32Array(), error: 'Missing attribute size'},
   {typedArray: new Uint8Array(), size: 1, error: 'Bad 16 bit alignment'},
@@ -23,9 +29,9 @@ const TEST_CASES: {typedArray: TypedArray, size?: number, result?: VertexFormat,
 ];
 
 test('api#getVertexFormatFromAttribute', t => {
-  for (const {typedArray, size, result, error} of TEST_CASES) {
+  for (const {typedArray, size, normalized, result, error} of TEST_CASES) {
     if (result) {
-      const vertexFormat = getVertexFormatFromAttribute(typedArray, size);
+      const vertexFormat = getVertexFormatFromAttribute(typedArray, size, normalized);
       t.deepEqual(
         vertexFormat,
         result,

modules/engine/src/geometry/gpu-geometry.ts

@@ -114,8 +114,8 @@ export function getAttributeBuffersFromGeometry(
       case 'TEXCOORD_0': name = 'texCoords'; break;
     }
     attributes[name] = device.createBuffer({data: attribute.value, id: `${attributeName}-buffer`});
-    const {value, size} = attribute;
-    bufferLayout.push({name, format: getVertexFormatFromAttribute(value, size)});
+    const {value, size, normalized} = attribute;
+    bufferLayout.push({name, format: getVertexFormatFromAttribute(value, size, normalized)});
   }
 
   const vertexCount = geometry._calculateVertexCount(geometry.attributes, geometry.indices)