diff --git a/examples/experimental/interleaved-buffer/app.js b/examples/experimental/interleaved-buffer/app.js index c594006977e..d8209c34c76 100644 --- a/examples/experimental/interleaved-buffer/app.js +++ b/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({ diff --git a/modules/aggregation-layers/package.json b/modules/aggregation-layers/package.json index d02e3d6fdb7..dcfc4422913 100644 --- a/modules/aggregation-layers/package.json +++ b/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" } diff --git a/modules/arcgis/package.json b/modules/arcgis/package.json index 1e90476bf9a..5e66606aaf2 100644 --- a/modules/arcgis/package.json +++ b/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", diff --git a/modules/carto/package.json b/modules/carto/package.json index d2c2a5126d5..39a3f57970e 100644 --- a/modules/carto/package.json +++ b/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", diff --git a/modules/core/package.json b/modules/core/package.json index 42c6e3948c5..13e1268fb66 100644 --- a/modules/core/package.json +++ b/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", diff --git a/modules/core/src/lib/attribute/attribute.ts b/modules/core/src/lib/attribute/attribute.ts index d924d4dd060..977f8e8a859 100644 --- a/modules/core/src/lib/attribute/attribute.ts +++ b/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 | null; needsUpdate: string | boolean; needsRedraw: string | boolean; + layoutChanged: boolean; updateRanges: number[][]; }; @@ -70,6 +77,7 @@ export default class Attribute extends DataColumn) { + 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 = Options & defaultValue?: number | number[]; }; -type DataColumnSettings = DataColumnOptions & { +export type DataColumnSettings = DataColumnOptions & { type: number; size: number; logicalType?: number; @@ -296,6 +296,10 @@ export default class DataColumn { return result; } + setAccessor(accessor: DataColumnSettings) { + this.state.bufferAccessor = accessor; + } + getAccessor(): DataColumnSettings { return this.state.bufferAccessor; } @@ -358,7 +362,6 @@ export default class DataColumn { } const accessor: DataColumnSettings = {...this.settings, ...opts}; - state.bufferAccessor = accessor; state.bounds = null; // clear cached bounds if (opts.constant) { @@ -400,11 +403,19 @@ export default class DataColumn { 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 { accessor.type = opts.type || buffer.accessor.type; } + this.setAccessor(accessor); + return true; } @@ -478,7 +491,7 @@ export default class DataColumn { state.allocatedValue = value; state.constant = false; state.externalBuffer = null; - state.bufferAccessor = this.settings; + this.setAccessor(this.settings); return true; } diff --git a/modules/core/src/lib/attribute/gl-utils.ts b/modules/core/src/lib/attribute/gl-utils.ts index 4328aa126cc..73adff86e3a 100644 --- a/modules/core/src/lib/attribute/gl-utils.ts +++ b/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) + ); +} diff --git a/modules/core/src/lib/layer.ts b/modules/core/src/lib/layer.ts index b6c7e39f4c3..9644ba1afe4 100644 --- a/modules/core/src/lib/layer.ts +++ b/modules/core/src/lib/layer.ts @@ -634,8 +634,16 @@ export default abstract class Layer 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 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 = {}; diff --git a/modules/core/src/utils/tesselator.ts b/modules/core/src/utils/tesselator.ts index 1d62ece3467..42a51f205f5 100644 --- a/modules/core/src/utils/tesselator.ts +++ b/modules/core/src/utils/tesselator.ts @@ -105,10 +105,10 @@ export default abstract class Tesselator extends const attributeManager = this.getAttributeManager(); /* eslint-disable max-len */ attributeManager.addInstanced({ - instancePositions: { + vertexPositions: { size: 3, // Start filling buffer from 1 vertex in vertexOffset: 1, diff --git a/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-main.glsl.ts b/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-main.glsl.ts index 2fb9cd530a9..61242d6f1e0 100644 --- a/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-main.glsl.ts +++ b/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-main.glsl.ts @@ -20,9 +20,6 @@ export default `\ -attribute vec2 positions; -attribute float instanceVertexValid; - uniform bool extruded; uniform bool isWireframe; uniform float elevationScale; @@ -34,10 +31,9 @@ struct PolygonProps { vec4 fillColors; vec4 lineColors; vec3 positions; - vec3 nextPositions; - vec3 pickingColors; vec3 positions64Low; - vec3 nextPositions64Low; + vec3 pickingColors; + vec3 normal; float elevations; }; @@ -51,49 +47,24 @@ vec3 project_offset_normal(vec3 vector) { } void calculatePosition(PolygonProps props) { -#ifdef IS_SIDE_VERTEX - if(instanceVertexValid < 0.5){ - gl_Position = vec4(0.); - return; - } -#endif - - vec3 pos; - vec3 pos64Low; + vec3 pos = props.positions; + vec3 pos64Low = props.positions64Low; vec3 normal; vec4 colors = isWireframe ? props.lineColors : props.fillColors; geometry.worldPosition = props.positions; - geometry.worldPositionAlt = props.nextPositions; geometry.pickingColor = props.pickingColors; -#ifdef IS_SIDE_VERTEX - pos = mix(props.positions, props.nextPositions, positions.x); - pos64Low = mix(props.positions64Low, props.nextPositions64Low, positions.x); -#else - pos = props.positions; - pos64Low = props.positions64Low; -#endif - if (extruded) { - pos.z += props.elevations * positions.y * elevationScale; + pos.z += props.elevations * elevationScale; } gl_Position = project_position_to_clipspace(pos, pos64Low, vec3(0.), geometry.position); DECKGL_FILTER_GL_POSITION(gl_Position, geometry); if (extruded) { - #ifdef IS_SIDE_VERTEX - normal = vec3( - props.positions.y - props.nextPositions.y + (props.positions64Low.y - props.nextPositions64Low.y), - props.nextPositions.x - props.positions.x + (props.nextPositions64Low.x - props.positions64Low.x), - 0.0); - normal = project_offset_normal(normal); - #else - normal = project_normal(vec3(0.0, 0.0, 1.0)); - #endif - geometry.normal = normal; - vec3 lightColor = lighting_getLightColor(colors.rgb, project_uCameraPosition, geometry.position.xyz, normal); + geometry.normal = props.normal; + vec3 lightColor = lighting_getLightColor(colors.rgb, project_uCameraPosition, geometry.position.xyz, geometry.normal); vColor = vec4(lightColor, colors.a * opacity); } else { vColor = vec4(colors.rgb, colors.a * opacity); diff --git a/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-side.glsl.ts b/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-side.glsl.ts index 6c1bc9ddbcf..260a3acb65b 100644 --- a/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-side.glsl.ts +++ b/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-side.glsl.ts @@ -22,8 +22,8 @@ import main from './solid-polygon-layer-vertex-main.glsl'; export default `\ #define SHADER_NAME solid-polygon-layer-vertex-shader-side -#define IS_SIDE_VERTEX +attribute vec2 positions; attribute vec3 instancePositions; attribute vec3 instanceNextPositions; @@ -33,24 +33,45 @@ attribute float instanceElevations; attribute vec4 instanceFillColors; attribute vec4 instanceLineColors; attribute vec3 instancePickingColors; +attribute float instanceVertexValid; ${main} void main(void) { + if(instanceVertexValid < 0.5){ + gl_Position = vec4(0.); + return; + } + PolygonProps props; + vec3 pos; + vec3 pos64Low; + vec3 nextPos; + vec3 nextPos64Low; + #if RING_WINDING_ORDER_CW == 1 - props.positions = instancePositions; - props.positions64Low = instancePositions64Low; - props.nextPositions = instanceNextPositions; - props.nextPositions64Low = instanceNextPositions64Low; + pos = instancePositions; + pos64Low = instancePositions64Low; + nextPos = instanceNextPositions; + nextPos64Low = instanceNextPositions64Low; #else - props.positions = instanceNextPositions; - props.positions64Low = instanceNextPositions64Low; - props.nextPositions = instancePositions; - props.nextPositions64Low = instancePositions64Low; + pos = instanceNextPositions; + pos64Low = instanceNextPositions64Low; + nextPos = instancePositions; + nextPos64Low = instancePositions64Low; #endif - props.elevations = instanceElevations; + + props.positions = mix(pos, nextPos, positions.x); + props.positions64Low = mix(pos64Low, nextPos64Low, positions.x); + + vec3 normal = vec3( + pos.y - nextPos.y + (pos64Low.y - nextPos64Low.y), + nextPos.x - pos.x + (nextPos64Low.x - pos64Low.x), + 0.0); + props.normal = project_offset_normal(normal); + + props.elevations = instanceElevations * positions.y; props.fillColors = instanceFillColors; props.lineColors = instanceLineColors; props.pickingColors = instancePickingColors; diff --git a/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-top.glsl.ts b/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-top.glsl.ts index c38077b750a..120907e1d98 100644 --- a/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-top.glsl.ts +++ b/modules/layers/src/solid-polygon-layer/solid-polygon-layer-vertex-top.glsl.ts @@ -41,6 +41,7 @@ void main(void) { props.fillColors = fillColors; props.lineColors = lineColors; props.pickingColors = pickingColors; + props.normal = project_normal(vec3(0.0, 0.0, 1.0)); calculatePosition(props); } diff --git a/modules/layers/src/solid-polygon-layer/solid-polygon-layer.ts b/modules/layers/src/solid-polygon-layer/solid-polygon-layer.ts index 07b385045b6..8e44bce165e 100644 --- a/modules/layers/src/solid-polygon-layer/solid-polygon-layer.ts +++ b/modules/layers/src/solid-polygon-layer/solid-polygon-layer.ts @@ -430,10 +430,6 @@ export default class SolidPolygonLayer excludeAttributes: {instanceVertexValid: true} } }); - - topModel.setConstantAttributes({ - positions: new Float32Array([0, 1]) - }); } if (extruded) { sideModel = new Model(this.context.device, { diff --git a/modules/mapbox/package.json b/modules/mapbox/package.json index d49a1615f5a..ed82e091008 100644 --- a/modules/mapbox/package.json +++ b/modules/mapbox/package.json @@ -30,7 +30,7 @@ "prepublishOnly": "npm run build-bundle && npm run build-bundle -- --env=dev" }, "dependencies": { - "@luma.gl/core": "9.0.0-alpha.36", + "@luma.gl/core": "9.0.0-alpha.37", "@math.gl/web-mercator": "4.0.0-alpha.4", "@types/mapbox-gl": "^2.6.3" }, diff --git a/modules/mesh-layers/package.json b/modules/mesh-layers/package.json index 77b7511b16c..b52affd2499 100644 --- a/modules/mesh-layers/package.json +++ b/modules/mesh-layers/package.json @@ -35,8 +35,8 @@ "dependencies": { "@babel/runtime": "^7.0.0", "@loaders.gl/gltf": "^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" } diff --git a/modules/test-utils/package.json b/modules/test-utils/package.json index b82ea898fe2..c948cdace08 100644 --- a/modules/test-utils/package.json +++ b/modules/test-utils/package.json @@ -28,8 +28,8 @@ }, "peerDependencies": { "@deck.gl/core": "^8.0.0", - "@luma.gl/test-utils": "9.0.0-alpha.36", - "@luma.gl/webgl": "9.0.0-alpha.36", + "@luma.gl/test-utils": "9.0.0-alpha.37", + "@luma.gl/webgl": "9.0.0-alpha.37", "@probe.gl/test-utils": "^4.0.4" }, "scripts": {}, diff --git a/package.json b/package.json index 9f266b601e9..1217d9791a1 100644 --- a/package.json +++ b/package.json @@ -60,8 +60,8 @@ "@babel/register": "^7.13.0", "@loaders.gl/csv": "^3.4.13", "@loaders.gl/polyfills": "^3.4.13", - "@luma.gl/test-utils": "9.0.0-alpha.36", - "@luma.gl/webgpu": "9.0.0-alpha.36", + "@luma.gl/test-utils": "9.0.0-alpha.37", + "@luma.gl/webgpu": "9.0.0-alpha.37", "@math.gl/proj4": "4.0.0-alpha.4", "@probe.gl/bench": "^4.0.4", "@probe.gl/test-utils": "^4.0.4", diff --git a/test/render/test-cases/core-layers.js b/test/render/test-cases/core-layers.js index e57478e84b5..ea408016b44 100644 --- a/test/render/test-cases/core-layers.js +++ b/test/render/test-cases/core-layers.js @@ -227,67 +227,66 @@ export default [ }) ], goldenImage: './test/render/golden-images/bitmap-imagecoordinates.png' - } - // TODO - v9 binary attributes - // { - // name: 'binary', - // views: new OrthographicView(), - // viewState: { - // target: [7, 7, 0], - // zoom: 4.5 - // }, - // layers: [ - // new SolidPolygonLayer({ - // id: 'binary-polygons', - // data: { - // length: 2, - // startIndices: [0, 3], - // attributes: { - // indices: new Uint16Array([0, 1, 2, 3, 4, 5, 4, 5, 6]), - // getPolygon: {value: new Float64Array(BINARY_DATA), size: 3, offset: 24, stride: 48}, - // getFillColor: { - // value: new Float32Array(BINARY_DATA), - // size: 3, - // stride: 24, - // normalized: false - // } - // } - // }, - // _normalize: false, - // getWidth: 0.5 - // }), + }, + { + name: 'binary', + views: new OrthographicView(), + viewState: { + target: [7, 7, 0], + zoom: 4.5 + }, + layers: [ + new SolidPolygonLayer({ + id: 'binary-polygons', + data: { + length: 2, + startIndices: [0, 3], + attributes: { + indices: new Uint16Array([0, 1, 2, 3, 4, 5, 4, 5, 6]), + getPolygon: {value: new Float64Array(BINARY_DATA), size: 3, offset: 24, stride: 48}, + getFillColor: { + value: new Float32Array(BINARY_DATA), + size: 3, + stride: 24, + normalized: false + } + } + }, + _normalize: false, + getWidth: 0.5 + }), - // new PathLayer({ - // id: 'binary-paths', - // data: { - // length: 2, - // startIndices: [0, 3], - // attributes: { - // getPath: {value: new Float32Array(BINARY_DATA), size: 3, offset: 12, stride: 24}, - // getColor: {value: new Float32Array(BINARY_DATA), size: 3, stride: 24, normalized: false} - // } - // }, - // _pathType: 'open', - // getWidth: 0.5 - // }), + new PathLayer({ + id: 'binary-paths', + data: { + length: 2, + startIndices: [0, 3], + attributes: { + getPath: {value: new Float32Array(BINARY_DATA), size: 3, offset: 12, stride: 24}, + getColor: {value: new Float32Array(BINARY_DATA), size: 3, stride: 24, normalized: false} + } + }, + _pathType: 'open', + getWidth: 0.5 + }), - // new ScatterplotLayer({ - // id: 'binary-points', - // data: { - // length: 7, - // attributes: { - // getPosition: {value: new Float64Array(BINARY_DATA), size: 3, offset: 24, stride: 48}, - // getFillColor: { - // value: new Float32Array(BINARY_DATA), - // size: 3, - // stride: 24, - // normalized: false - // } - // } - // }, - // getRadius: 1 - // }) - // ], - // goldenImage: './test/render/golden-images/binary.png' - // } + new ScatterplotLayer({ + id: 'binary-points', + data: { + length: 7, + attributes: { + getPosition: {value: new Float64Array(BINARY_DATA), size: 3, offset: 24, stride: 48}, + getFillColor: { + value: new Float32Array(BINARY_DATA), + size: 3, + stride: 24, + normalized: false + } + } + }, + getRadius: 1 + }) + ], + goldenImage: './test/render/golden-images/binary.png' + } ]; diff --git a/test/render/test-cases/icon-layer.js b/test/render/test-cases/icon-layer.js index 906cc0995dc..fc2704b9904 100644 --- a/test/render/test-cases/icon-layer.js +++ b/test/render/test-cases/icon-layer.js @@ -31,43 +31,42 @@ export default [ ], goldenImage: './test/render/golden-images/icon-lnglat.png' }, - // TODO - v9 binary attributes - // { - // name: 'icon-lnglat-external-buffer', - // viewState: { - // latitude: 37.751537058389985, - // longitude: -122.42694203247012, - // zoom: 11.5, - // pitch: 0, - // bearing: 0 - // }, - // // rendering times - // layers: [ - // new IconLayer({ - // id: 'icon-lnglat', - // data: { - // length: points.length, - // attributes: { - // getPosition: { - // value: new Float32Array(points.flatMap(d => d.COORDINATES)), - // size: 2 - // }, - // getSize: new Float32Array(points.flatMap(d => (d.RACKS > 2 ? 2 : 1))), - // getIcon: { - // value: new Uint8Array(points.flatMap(d => (d.PLACEMENT === 'SW' ? 1 : 2))), - // size: 1 - // } - // } - // }, - // iconAtlas: ICON_ATLAS, - // iconMapping: {1: iconMapping.marker, 2: iconMapping['marker-warning']}, - // sizeScale: 12, - // getColor: [64, 64, 72], - // opacity: 0.8 - // }) - // ], - // goldenImage: './test/render/golden-images/icon-lnglat.png' - // }, + { + name: 'icon-lnglat-external-buffer', + viewState: { + latitude: 37.751537058389985, + longitude: -122.42694203247012, + zoom: 11.5, + pitch: 0, + bearing: 0 + }, + // rendering times + layers: [ + new IconLayer({ + id: 'icon-lnglat', + data: { + length: points.length, + attributes: { + getPosition: { + value: new Float32Array(points.flatMap(d => d.COORDINATES)), + size: 2 + }, + getSize: new Float32Array(points.flatMap(d => (d.RACKS > 2 ? 2 : 1))), + getIcon: { + value: new Uint8Array(points.flatMap(d => (d.PLACEMENT === 'SW' ? 1 : 2))), + size: 1 + } + } + }, + iconAtlas: ICON_ATLAS, + iconMapping: {1: iconMapping.marker, 2: iconMapping['marker-warning']}, + sizeScale: 12, + getColor: [64, 64, 72], + opacity: 0.8 + }) + ], + goldenImage: './test/render/golden-images/icon-lnglat.png' + }, { name: 'icon-lnglat-facing-up', viewState: { diff --git a/test/render/test-cases/index.js b/test/render/test-cases/index.js index 06e6ae62c93..94e40ba2437 100644 --- a/test/render/test-cases/index.js +++ b/test/render/test-cases/index.js @@ -51,7 +51,7 @@ export default [].concat( quadkeyLayerTests, s2LayerTests, tripsLayerTests, - // mvtLayerTests, + mvtLayerTests, geohashLayerTests, // simpleMeshLayerTests, // scenegraphLayerTests, diff --git a/test/render/test-cases/path-layer.js b/test/render/test-cases/path-layer.js index c391ecc339c..cb99bfb43d3 100644 --- a/test/render/test-cases/path-layer.js +++ b/test/render/test-cases/path-layer.js @@ -49,47 +49,46 @@ export default [ ], goldenImage: './test/render/golden-images/path-lnglat.png' }, - // TODO - v9 binary attributes - // { - // name: 'path-lnglat-binary', - // viewState: { - // latitude: 37.751537058389985, - // longitude: -122.42694203247012, - // zoom: 11.5, - // pitch: 0, - // bearing: 0 - // }, - // layers: [ - // new PathLayer({ - // id: 'path-lnglat', - // data: { - // length: zigzag.length, - // startIndices: zigzag.reduce( - // (acc, d) => { - // acc.push(acc[acc.length - 1] + d.path.length); - // return acc; - // }, - // [0] - // ), - // attributes: { - // getPath: { - // value: new Float64Array(zigzag.flatMap(d => d.path.flat())), - // size: 2 - // }, - // getColor: { - // value: new Uint8Array(zigzag.flatMap(d => d.path.flatMap(p => [255, 0, 0]))), - // size: 3 - // } - // } - // }, - // getWidth: 200, - // miterLimit: 0, - // opacity: 0.6, - // widthMinPixels: 1 - // }) - // ], - // goldenImage: './test/render/golden-images/path-lnglat.png' - // }, + { + name: 'path-lnglat-binary', + viewState: { + latitude: 37.751537058389985, + longitude: -122.42694203247012, + zoom: 11.5, + pitch: 0, + bearing: 0 + }, + layers: [ + new PathLayer({ + id: 'path-lnglat', + data: { + length: zigzag.length, + startIndices: zigzag.reduce( + (acc, d) => { + acc.push(acc[acc.length - 1] + d.path.length); + return acc; + }, + [0] + ), + attributes: { + getPath: { + value: new Float64Array(zigzag.flatMap(d => d.path.flat())), + size: 2 + }, + getColor: { + value: new Uint8Array(zigzag.flatMap(d => d.path.flatMap(p => [255, 0, 0]))), + size: 3 + } + } + }, + getWidth: 200, + miterLimit: 0, + opacity: 0.6, + widthMinPixels: 1 + }) + ], + goldenImage: './test/render/golden-images/path-lnglat.png' + }, { name: 'path-billboard', viewState: { diff --git a/test/render/test-cases/point-cloud-layer.js b/test/render/test-cases/point-cloud-layer.js index 66cc74f3d3f..e8497618f38 100644 --- a/test/render/test-cases/point-cloud-layer.js +++ b/test/render/test-cases/point-cloud-layer.js @@ -54,34 +54,33 @@ export default [ }) ], goldenImage: './test/render/golden-images/pointcloud-lnglat.png' + }, + { + name: 'pointcloud-meter', + viewState: { + latitude: 37.751537058389985, + longitude: -122.42694203247012, + zoom: 13, + pitch: 0, + bearing: 0 + }, + layers: [ + new PointCloudLayer({ + id: 'pointcloud-meter', + data: { + length: POINTCLOUD.length, + attributes: { + getPosition: new Float32Array(POINTCLOUD.flatMap(d => d.position)), + getNormal: new Float32Array(POINTCLOUD.flatMap(d => d.normal)), + getColor: {value: new Uint8Array(POINTCLOUD.flatMap(d => d.color)), size: 3} + } + }, + coordinateSystem: COORDINATE_SYSTEM.METER_OFFSETS, + coordinateOrigin: positionOrigin, + pointSize: 1.333333, + pickable: true + }) + ], + goldenImage: './test/render/golden-images/pointcloud-meter.png' } - // TODO - v9 binary buffer - // { - // name: 'pointcloud-meter', - // viewState: { - // latitude: 37.751537058389985, - // longitude: -122.42694203247012, - // zoom: 13, - // pitch: 0, - // bearing: 0 - // }, - // layers: [ - // new PointCloudLayer({ - // id: 'pointcloud-meter', - // data: { - // length: POINTCLOUD.length, - // attributes: { - // getPosition: new Float32Array(POINTCLOUD.flatMap(d => d.position)), - // getNormal: new Float32Array(POINTCLOUD.flatMap(d => d.normal)), - // getColor: {value: new Uint8Array(POINTCLOUD.flatMap(d => d.color)), size: 3} - // } - // }, - // coordinateSystem: COORDINATE_SYSTEM.METER_OFFSETS, - // coordinateOrigin: positionOrigin, - // pointSize: 1.333333, - // pickable: true - // }) - // ], - // goldenImage: './test/render/golden-images/pointcloud-meter.png' - // } ]; diff --git a/test/render/test-cases/text-layer.js b/test/render/test-cases/text-layer.js index 191de9f3e77..48cc62f8895 100644 --- a/test/render/test-cases/text-layer.js +++ b/test/render/test-cases/text-layer.js @@ -103,39 +103,38 @@ export default OS === 'Mac' imageDiffOptions, goldenImage: './test/render/golden-images/text-layer.png' }, - // TODO - v9 binary attributes - // { - // name: 'text-layer-binary', - // viewState: { - // latitude: 37.751, - // longitude: -122.427, - // zoom: 11.5, - // pitch: 0, - // bearing: 0 - // }, - // layers: [ - // new TextLayer({ - // id: 'text-layer', - // data: getBinaryAttributes( - // points.slice(0, 50), - // x => `${x.PLACEMENT}-${x.YR_INSTALLED}`, - // { - // getPosition: {accessor: x => x.COORDINATES, size: 2}, - // getColor: {accessor: x => [1, 0, 0], size: 3, normalized: false} - // } - // ), - // fontFamily: 'Arial', - // getSize: 20, - // getAngle: 0, - // sizeScale: 1, - // getTextAnchor: 'start', - // getAlignmentBaseline: 'center', - // getPixelOffset: [10, 0] - // }) - // ], - // imageDiffOptions, - // goldenImage: './test/render/golden-images/text-layer.png' - // }, + { + name: 'text-layer-binary', + viewState: { + latitude: 37.751, + longitude: -122.427, + zoom: 11.5, + pitch: 0, + bearing: 0 + }, + layers: [ + new TextLayer({ + id: 'text-layer', + data: getBinaryAttributes( + points.slice(0, 50), + x => `${x.PLACEMENT}-${x.YR_INSTALLED}`, + { + getPosition: {accessor: x => x.COORDINATES, size: 2}, + getColor: {accessor: x => [1, 0, 0], size: 3, normalized: false} + } + ), + fontFamily: 'Arial', + getSize: 20, + getAngle: 0, + sizeScale: 1, + getTextAnchor: 'start', + getAlignmentBaseline: 'center', + getPixelOffset: [10, 0] + }) + ], + imageDiffOptions, + goldenImage: './test/render/golden-images/text-layer.png' + }, { name: 'text-layer-multi-lines', viewState: { diff --git a/yarn.lock b/yarn.lock index 1f0f9feff5f..a6e6e7abb12 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2687,10 +2687,10 @@ "@loaders.gl/schema" "3.4.13" fast-xml-parser "^4.2.5" -"@luma.gl/constants@9.0.0-alpha.36": - version "9.0.0-alpha.36" - resolved "https://registry.yarnpkg.com/@luma.gl/constants/-/constants-9.0.0-alpha.36.tgz#21117179b6430e3decac81776ec6a7aadb1c8a0f" - integrity sha512-4KAPPdMudgR4z1vOYNh/yGgL2LXwdMSnJTLD9ve1QSmrzAZIeArF9z1Dos+JP6slZ5KZ13IMEfMoocpdUJaz5Q== +"@luma.gl/constants@9.0.0-alpha.37": + version "9.0.0-alpha.37" + resolved "https://registry.yarnpkg.com/@luma.gl/constants/-/constants-9.0.0-alpha.37.tgz#1b5e136bc89e6ce8234b52c038cb020f6d2a5cb2" + integrity sha512-bWZ2XsEhAyGxncWicufYehojU1XUZxrJPL1T+QBpRggzmnzmVlmdLtLFCQWxdPmDF3sdcBN4G1lVMNY/UDli4A== "@luma.gl/constants@^8.4.0": version "8.4.0" @@ -2702,67 +2702,67 @@ resolved "https://registry.yarnpkg.com/@luma.gl/constants/-/constants-8.5.20.tgz#91de116f68110fb28a000b59747d34d54bc06ab2" integrity sha512-5yG+ybkUZ4j6kLPWMZjN4Hun2yLB0MyEpNCRKAUN9/yS9UIWA7unyVxjSf2vnE7k/7dywtxlbXegASNFgNVGxw== -"@luma.gl/core@9.0.0-alpha.36": - version "9.0.0-alpha.36" - resolved "https://registry.yarnpkg.com/@luma.gl/core/-/core-9.0.0-alpha.36.tgz#395e87e5d0f3676787593282bf5e824a3a9ab364" - integrity sha512-Z6WAdX0Lj5XRO1N0n6tvtCzL3fcnIEen0Ap/d8pxHhNRvSP+W59GK/L4eWGCpzekPscoXlMEq+kV4grTS0/Cqg== +"@luma.gl/core@9.0.0-alpha.37": + version "9.0.0-alpha.37" + resolved "https://registry.yarnpkg.com/@luma.gl/core/-/core-9.0.0-alpha.37.tgz#778a8ae238550c855f2669b1d4a66e43157a9a03" + integrity sha512-bDfDaVKCJRIMZQ4qwRJlwitOj7A8bP/aXxC7FuNdfA9YWMbbMQQbiQLMAtYpmR8IJTP9Z/mjrB1RH8QOa0Vwwg== dependencies: "@babel/runtime" "^7.0.0" "@types/offscreencanvas" "^2019.6.4" -"@luma.gl/engine@9.0.0-alpha.36": - version "9.0.0-alpha.36" - resolved "https://registry.yarnpkg.com/@luma.gl/engine/-/engine-9.0.0-alpha.36.tgz#46397582c3c010681ccbd76c0461af98d5398792" - integrity sha512-QcreMElQbB7InzaT5k0qG5G6xMnFrT5Wg/IJHuLdd71emFodqcjndFVKt9k0ozGVKNQdZimhysP/vLANq4tGEA== +"@luma.gl/engine@9.0.0-alpha.37": + version "9.0.0-alpha.37" + resolved "https://registry.yarnpkg.com/@luma.gl/engine/-/engine-9.0.0-alpha.37.tgz#17a9c13a4e03e0fe91b9f45cba621bffffdf3720" + integrity sha512-SzuXVVJ1FeQwV5LMJnYKgzTeikTYzxm6ge+ZnhTpVtwHsZOrr58wfuHjr09IN29uJey45oicYKbNNHx3Y+HvsQ== 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/core" "4.0.0-alpha.4" "@probe.gl/log" "^4.0.2" "@probe.gl/stats" "^4.0.2" -"@luma.gl/shadertools@9.0.0-alpha.36": - version "9.0.0-alpha.36" - resolved "https://registry.yarnpkg.com/@luma.gl/shadertools/-/shadertools-9.0.0-alpha.36.tgz#7146229068fbd61afb445ff82ba43f2e3cd43166" - integrity sha512-JDZf9fw6cMbeCWKItEAKThlA+zQ6MwJ5aQjdj6tHg7FNpQ6T0j+aDkxa7A+8ErKyON7nMSGJEXGP1klrf2/sZQ== +"@luma.gl/shadertools@9.0.0-alpha.37": + version "9.0.0-alpha.37" + resolved "https://registry.yarnpkg.com/@luma.gl/shadertools/-/shadertools-9.0.0-alpha.37.tgz#a1d6d489a5e1d966bbd8f41d59f8af5265fe8fd0" + integrity sha512-hucHjjTvJNdOYJFQPn4x2aVW5G2Zx+QbmA65ITsnKFn1LsEl6rB4ggN6qBNGyk1GhnTFHw9zMe5mUPeo33ugOw== dependencies: "@babel/runtime" "^7.0.0" - "@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/types" "4.0.0-alpha.4" -"@luma.gl/test-utils@9.0.0-alpha.36": - version "9.0.0-alpha.36" - resolved "https://registry.yarnpkg.com/@luma.gl/test-utils/-/test-utils-9.0.0-alpha.36.tgz#93117ea77f72e6dd8ccc5138909fdaa569be182b" - integrity sha512-TkPwO5L7zASjbtF0gI4bXmCR9C2EeKVI+fhTl2URPyVunLJGnZIukWSFsDw8yIlN8GRojhIJ4CI4H7hveNapxA== +"@luma.gl/test-utils@9.0.0-alpha.37": + version "9.0.0-alpha.37" + resolved "https://registry.yarnpkg.com/@luma.gl/test-utils/-/test-utils-9.0.0-alpha.37.tgz#9030607a9fdbedfc2f8fbee2e6a4d6797528fd9b" + integrity sha512-u4BS+2a4O3ESnEOchwmx9ADtpQjeWO0J9ThibCCSWW6gyEgPpChzpKH0qEVixejpzJfqzYqIygCM6P244zOQ8g== dependencies: - "@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/webgpu" "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/webgpu" "9.0.0-alpha.37" "@probe.gl/env" "^4.0.2" "@types/gl" "^6.0.2" gl "^6.0.1" -"@luma.gl/webgl@9.0.0-alpha.36": - version "9.0.0-alpha.36" - resolved "https://registry.yarnpkg.com/@luma.gl/webgl/-/webgl-9.0.0-alpha.36.tgz#08b2cf368da3cc763c92ca521ae305eb793eee7b" - integrity sha512-ytRWmwe2ccVDaRImF/y3C9qkZOkrThLAoVLIdwf4kLdD4BSa98tLvRdAnSjsi3/Wc0nLE2V4Rdpmd0sNDrxKTw== +"@luma.gl/webgl@9.0.0-alpha.37": + version "9.0.0-alpha.37" + resolved "https://registry.yarnpkg.com/@luma.gl/webgl/-/webgl-9.0.0-alpha.37.tgz#5adf620247ef83f32e3d11f312af9e1b6f0be6a4" + integrity sha512-RKB94N1Q+NY9bhESpvqXIPP7ZqqJhUkCQ6+PuMldFwhJ12STwAD/twD7EozJwxxM0PezUn2i0UgN1sJlfoBkNA== dependencies: "@babel/runtime" "^7.0.0" - "@luma.gl/constants" "9.0.0-alpha.36" - "@luma.gl/core" "9.0.0-alpha.36" + "@luma.gl/constants" "9.0.0-alpha.37" + "@luma.gl/core" "9.0.0-alpha.37" "@probe.gl/env" "^4.0.2" -"@luma.gl/webgpu@9.0.0-alpha.36": - version "9.0.0-alpha.36" - resolved "https://registry.yarnpkg.com/@luma.gl/webgpu/-/webgpu-9.0.0-alpha.36.tgz#4e3d8aac6342bc55d823b2f5006b71290dd8d69b" - integrity sha512-4C+eiGOvdRvxsemq5lv0F58549CI53SpdEdmVJzHej+vKu4rBAtX5s/QapbIowPrSJlqMPRXnLMRbw+jbgb8lg== +"@luma.gl/webgpu@9.0.0-alpha.37": + version "9.0.0-alpha.37" + resolved "https://registry.yarnpkg.com/@luma.gl/webgpu/-/webgpu-9.0.0-alpha.37.tgz#d814273b2ce62496ef92ef94b1cd412fd4a22291" + integrity sha512-0uBzrVarXuY5FuselmHQTALeFZiy3+OSs4h68SS0s4dJOYjvkGELfJ1l2iVgdBj9FVHliKEQAO205TzyAU8sNQ== dependencies: "@babel/runtime" "^7.0.0" - "@luma.gl/core" "9.0.0-alpha.36" + "@luma.gl/core" "9.0.0-alpha.37" "@probe.gl/env" "^4.0.2" "@webgpu/types" "^0.1.34"