@deck.gl/geo-layers 8.8.0-beta.5 → 8.8.2

package/package.json

@@ -2,7 +2,7 @@
   "name": "@deck.gl/geo-layers",
   "description": "deck.gl layers supporting geospatial use cases and GIS formats",
   "license": "MIT",
-  "version": "8.8.0-beta.5",
+  "version": "8.8.2",
   "publishConfig": {
     "access": "public"
   },
@@ -54,5 +54,5 @@
     "@loaders.gl/core": "^3.0.0",
     "@luma.gl/core": "^8.0.0"
   },
-  "gitHead": "20b7becdb467aa917c17c9517461bf62ecc48b12"
+  "gitHead": "17d768baed9e2149d3b62863e9db2b9d23bbf5ba"
 }

package/src/mesh-layer/mesh-layer.ts

@@ -3,7 +3,7 @@ import {GLTFMaterialParser} from '@luma.gl/experimental';
 import {Model, pbr} from '@luma.gl/core';
 import GL from '@luma.gl/constants';
 import type {MeshAttribute, MeshAttributes} from '@loaders.gl/schema';
-import type {UpdateParameters, DefaultProps} from '@deck.gl/core';
+import type {UpdateParameters, DefaultProps, LayerContext} from '@deck.gl/core';
 import {SimpleMeshLayer, SimpleMeshLayerProps} from '@deck.gl/mesh-layers';
 
 import vs from './mesh-layer-vertex.glsl';
@@ -102,6 +102,8 @@ export default class MeshLayer<DataT = any, ExtraProps = {}> extends SimpleMeshL
   protected getModel(mesh: Mesh): Model {
     const {id, pbrMaterial} = this.props;
     const materialParser = this.parseMaterial(pbrMaterial, mesh);
+    // Keep material parser to explicitly remove textures
+    this.setState({materialParser});
     const shaders = this.getShaders();
     validateGeometryAttributes(mesh.attributes);
     const model = new Model(this.context.gl, {
@@ -125,6 +127,8 @@ export default class MeshLayer<DataT = any, ExtraProps = {}> extends SimpleMeshL
     if (model) {
       const {mesh} = this.props;
       const materialParser = this.parseMaterial(pbrMaterial, mesh);
+      // Keep material parser to explicitly remove textures
+      this.setState({materialParser});
       model.setUniforms(materialParser.uniforms);
     }
   }
@@ -133,7 +137,11 @@ export default class MeshLayer<DataT = any, ExtraProps = {}> extends SimpleMeshL
     const unlit = Boolean(
       pbrMaterial.pbrMetallicRoughness && pbrMaterial.pbrMetallicRoughness.baseColorTexture
     );
-    const materialParser = new GLTFMaterialParser(this.context.gl, {
+
+    // @ts-expect-error - Need to add delete method to the luma gltf-material-parser.d.ts
+    this.state.materialParser?.delete();
+
+    return new GLTFMaterialParser(this.context.gl, {
       attributes: {NORMAL: mesh.attributes.normals, TEXCOORD_0: mesh.attributes.texCoords},
       material: {unlit, ...pbrMaterial},
       pbrDebug: false,
@@ -141,7 +149,6 @@ export default class MeshLayer<DataT = any, ExtraProps = {}> extends SimpleMeshL
       lights: true,
       useTangents: false
     });
-    return materialParser;
   }
 
   calculateFeatureIdsPickingColors(attribute) {
@@ -160,4 +167,11 @@ export default class MeshLayer<DataT = any, ExtraProps = {}> extends SimpleMeshL
 
     attribute.value = value;
   }
+
+  finalizeState(context: LayerContext) {
+    super.finalizeState(context);
+    // @ts-expect-error - Need to add delete method to the luma gltf-material-parser.d.ts
+    this.state.materialParser?.delete();
+    this.setState({materialParser: null});
+  }
 }

package/src/tile-layer/tile-layer.ts

@@ -11,7 +11,7 @@ import {
   _flatten as flatten
 } from '@deck.gl/core';
 import {GeoJsonLayer} from '@deck.gl/layers';
-import {LayersList} from 'modules/core/src/lib/layer-manager';
+import {LayersList} from '@deck.gl/core';
 import Tile2DHeader from './tile-2d-header';
 
 import Tileset2D, {RefinementStrategy, STRATEGY_DEFAULT, Tileset2DProps} from './tileset-2d';

package/typed/geo-cell-layer/GeoCellLayer.js

@@ -0,0 +1,49 @@
+import { CompositeLayer } from '@deck.gl/core';
+import { PolygonLayer } from '@deck.gl/layers';
+const defaultProps = {
+    ...PolygonLayer.defaultProps
+};
+export default class GeoCellLayer extends CompositeLayer {
+    /** Implement to generate props to create geometry. */
+    indexToBounds() {
+        return null;
+    }
+    renderLayers() {
+        // Rendering props underlying layer
+        const { elevationScale, extruded, wireframe, filled, stroked, lineWidthUnits, lineWidthScale, lineWidthMinPixels, lineWidthMaxPixels, lineJointRounded, lineMiterLimit, lineDashJustified, getElevation, getFillColor, getLineColor, getLineWidth } = this.props;
+        // Accessor props for underlying layers
+        const { updateTriggers, material, transitions } = this.props;
+        // Filled Polygon Layer
+        const CellLayer = this.getSubLayerClass('cell', PolygonLayer);
+        return new CellLayer({
+            filled,
+            wireframe,
+            extruded,
+            elevationScale,
+            stroked,
+            lineWidthUnits,
+            lineWidthScale,
+            lineWidthMinPixels,
+            lineWidthMaxPixels,
+            lineJointRounded,
+            lineMiterLimit,
+            lineDashJustified,
+            material,
+            transitions,
+            getElevation,
+            getFillColor,
+            getLineColor,
+            getLineWidth
+        }, this.getSubLayerProps({
+            id: 'cell',
+            updateTriggers: updateTriggers && {
+                getElevation: updateTriggers.getElevation,
+                getFillColor: updateTriggers.getFillColor,
+                getLineColor: updateTriggers.getLineColor,
+                getLineWidth: updateTriggers.getLineWidth
+            }
+        }), this.indexToBounds());
+    }
+}
+GeoCellLayer.layerName = 'GeoCellLayer';
+GeoCellLayer.defaultProps = defaultProps;

package/typed/great-circle-layer/great-circle-layer.js

@@ -0,0 +1,29 @@
+// 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 { ArcLayer } from '@deck.gl/layers';
+// This layer has been merged into the core ArcLayer
+// Keeping for backward-compatibility
+export default class GreatCircleLayer extends ArcLayer {
+}
+GreatCircleLayer.layerName = 'GreatCircleLayer';
+GreatCircleLayer.defaultProps = {
+    getHeight: { type: 'accessor', value: 0 },
+    greatCircle: true
+};

package/typed/h3-layers/h3-cluster-layer.js

@@ -0,0 +1,33 @@
+import { h3SetToMultiPolygon } from 'h3-js';
+import { createIterable } from '@deck.gl/core';
+import GeoCellLayer from '../geo-cell-layer/GeoCellLayer';
+const defaultProps = {
+    getHexagons: { type: 'accessor', value: d => d.hexagons }
+};
+export default class H3ClusterLayer extends GeoCellLayer {
+    updateState({ props, oldProps, changeFlags }) {
+        if (changeFlags.dataChanged ||
+            (changeFlags.updateTriggers && changeFlags.updateTriggers.getHexagons)) {
+            const { data, getHexagons } = props;
+            const polygons = [];
+            const { iterable, objectInfo } = createIterable(data);
+            for (const object of iterable) {
+                objectInfo.index++;
+                const hexagons = getHexagons(object, objectInfo);
+                const multiPolygon = h3SetToMultiPolygon(hexagons, true);
+                for (const polygon of multiPolygon) {
+                    polygons.push(this.getSubLayerRow({ polygon }, object, objectInfo.index));
+                }
+            }
+            this.setState({ polygons });
+        }
+    }
+    indexToBounds() {
+        return {
+            data: this.state.polygons,
+            getPolygon: d => d.polygon
+        };
+    }
+}
+H3ClusterLayer.defaultProps = defaultProps;
+H3ClusterLayer.layerName = 'H3ClusterLayer';

package/typed/h3-layers/h3-hexagon-layer.js

@@ -0,0 +1,251 @@
+import { h3ToGeoBoundary, h3GetResolution, h3ToGeo, geoToH3, h3IsPentagon, h3Distance, edgeLength, UNITS } from 'h3-js';
+import { lerp } from '@math.gl/core';
+import { CompositeLayer, createIterable } from '@deck.gl/core';
+import { ColumnLayer, PolygonLayer } from '@deck.gl/layers';
+// There is a cost to updating the instanced geometries when using highPrecision: false
+// This constant defines the distance between two hexagons that leads to "significant
+// distortion." Smaller value makes the column layer more sensitive to viewport change.
+const UPDATE_THRESHOLD_KM = 10;
+// normalize longitudes w.r.t center (refLng), when not provided first vertex
+export function normalizeLongitudes(vertices, refLng) {
+    refLng = refLng === undefined ? vertices[0][0] : refLng;
+    for (const pt of vertices) {
+        const deltaLng = pt[0] - refLng;
+        if (deltaLng > 180) {
+            pt[0] -= 360;
+        }
+        else if (deltaLng < -180) {
+            pt[0] += 360;
+        }
+    }
+}
+// scale polygon vertices w.r.t center (hexId)
+export function scalePolygon(hexId, vertices, factor) {
+    const [lat, lng] = h3ToGeo(hexId);
+    const actualCount = vertices.length;
+    // normalize with respect to center
+    normalizeLongitudes(vertices, lng);
+    // `h3ToGeoBoundary` returns same array object for first and last vertex (closed polygon),
+    // if so skip scaling the last vertex
+    const vertexCount = vertices[0] === vertices[actualCount - 1] ? actualCount - 1 : actualCount;
+    for (let i = 0; i < vertexCount; i++) {
+        vertices[i][0] = lerp(lng, vertices[i][0], factor);
+        vertices[i][1] = lerp(lat, vertices[i][1], factor);
+    }
+}
+function getHexagonCentroid(getHexagon, object, objectInfo) {
+    const hexagonId = getHexagon(object, objectInfo);
+    const [lat, lng] = h3ToGeo(hexagonId);
+    return [lng, lat];
+}
+function h3ToPolygon(hexId, coverage = 1, flatten) {
+    const vertices = h3ToGeoBoundary(hexId, true);
+    if (coverage !== 1) {
+        // scale and normalize vertices w.r.t to center
+        scalePolygon(hexId, vertices, coverage);
+    }
+    else {
+        // normalize w.r.t to start vertex
+        normalizeLongitudes(vertices);
+    }
+    if (flatten) {
+        const positions = new Float64Array(vertices.length * 2);
+        let i = 0;
+        for (const pt of vertices) {
+            positions[i++] = pt[0];
+            positions[i++] = pt[1];
+        }
+        return positions;
+    }
+    return vertices;
+}
+function mergeTriggers(getHexagon, coverage) {
+    let trigger;
+    if (getHexagon === undefined || getHexagon === null) {
+        trigger = coverage;
+    }
+    else if (typeof getHexagon === 'object') {
+        trigger = { ...getHexagon, coverage };
+    }
+    else {
+        trigger = { getHexagon, coverage };
+    }
+    return trigger;
+}
+const defaultProps = {
+    ...PolygonLayer.defaultProps,
+    highPrecision: 'auto',
+    coverage: { type: 'number', min: 0, max: 1, value: 1 },
+    centerHexagon: null,
+    getHexagon: { type: 'accessor', value: x => x.hexagon },
+    extruded: true
+};
+// not supported
+delete defaultProps.getLineDashArray;
+/**
+ * A subclass of HexagonLayer that uses H3 hexagonIds in data objects
+ * rather than centroid lat/longs. The shape of each hexagon is determined
+ * based on a single "center" hexagon, which can be selected by passing in
+ * a center lat/lon pair. If not provided, the map center will be used.
+ *
+ * Also sets the `hexagonId` field in the onHover/onClick callback's info
+ * objects. Since this is calculated using math, hexagonId will be present
+ * even when no corresponding hexagon is in the data set. You can check
+ * index !== -1 to see if picking matches an actual object.
+ */
+export default class H3HexagonLayer extends CompositeLayer {
+    shouldUpdateState({ changeFlags }) {
+        return this._shouldUseHighPrecision()
+            ? changeFlags.propsOrDataChanged
+            : changeFlags.somethingChanged;
+    }
+    updateState({ props, oldProps, changeFlags }) {
+        if (props.highPrecision !== true &&
+            (changeFlags.dataChanged ||
+                (changeFlags.updateTriggers && changeFlags.updateTriggers.getHexagon))) {
+            const dataProps = this._calculateH3DataProps(props);
+            this.setState(dataProps);
+        }
+        this._updateVertices(this.context.viewport);
+    }
+    _calculateH3DataProps(props) {
+        let resolution = -1;
+        let hasPentagon = false;
+        let hasMultipleRes = false;
+        const { iterable, objectInfo } = createIterable(props.data);
+        for (const object of iterable) {
+            objectInfo.index++;
+            const hexId = props.getHexagon(object, objectInfo);
+            // Take the resolution of the first hex
+            const hexResolution = h3GetResolution(hexId);
+            if (resolution < 0) {
+                resolution = hexResolution;
+                if (!props.highPrecision)
+                    break;
+            }
+            else if (resolution !== hexResolution) {
+                hasMultipleRes = true;
+                break;
+            }
+            if (h3IsPentagon(hexId)) {
+                hasPentagon = true;
+                break;
+            }
+        }
+        return {
+            resolution,
+            edgeLengthKM: resolution >= 0 ? edgeLength(resolution, UNITS.km) : 0,
+            hasMultipleRes,
+            hasPentagon
+        };
+    }
+    _shouldUseHighPrecision() {
+        if (this.props.highPrecision === 'auto') {
+            const { resolution, hasPentagon, hasMultipleRes } = this.state;
+            const { viewport } = this.context;
+            return (viewport.resolution || hasMultipleRes || hasPentagon || (resolution >= 0 && resolution <= 5));
+        }
+        return this.props.highPrecision;
+    }
+    _updateVertices(viewport) {
+        if (this._shouldUseHighPrecision()) {
+            return;
+        }
+        const { resolution, edgeLengthKM, centerHex } = this.state;
+        if (resolution < 0) {
+            return;
+        }
+        const hex = this.props.centerHexagon || geoToH3(viewport.latitude, viewport.longitude, resolution);
+        if (centerHex === hex) {
+            return;
+        }
+        if (centerHex) {
+            const distance = h3Distance(centerHex, hex);
+            // h3Distance returns a negative number if the distance could not be computed
+            // due to the two indexes very far apart or on opposite sides of a pentagon.
+            if (distance >= 0 && distance * edgeLengthKM < UPDATE_THRESHOLD_KM) {
+                return;
+            }
+        }
+        const { unitsPerMeter } = viewport.distanceScales;
+        let vertices = h3ToPolygon(hex);
+        const [centerLat, centerLng] = h3ToGeo(hex);
+        const [centerX, centerY] = viewport.projectFlat([centerLng, centerLat]);
+        vertices = vertices.map(p => {
+            const worldPosition = viewport.projectFlat(p);
+            return [
+                (worldPosition[0] - centerX) / unitsPerMeter[0],
+                (worldPosition[1] - centerY) / unitsPerMeter[1]
+            ];
+        });
+        this.setState({ centerHex: hex, vertices });
+    }
+    renderLayers() {
+        return this._shouldUseHighPrecision() ? this._renderPolygonLayer() : this._renderColumnLayer();
+    }
+    _getForwardProps() {
+        const { elevationScale, material, coverage, extruded, wireframe, stroked, filled, lineWidthUnits, lineWidthScale, lineWidthMinPixels, lineWidthMaxPixels, getFillColor, getElevation, getLineColor, getLineWidth, transitions, updateTriggers } = this.props;
+        return {
+            elevationScale,
+            extruded,
+            coverage,
+            wireframe,
+            stroked,
+            filled,
+            lineWidthUnits,
+            lineWidthScale,
+            lineWidthMinPixels,
+            lineWidthMaxPixels,
+            material,
+            getElevation,
+            getFillColor,
+            getLineColor,
+            getLineWidth,
+            transitions,
+            updateTriggers: {
+                getFillColor: updateTriggers.getFillColor,
+                getElevation: updateTriggers.getElevation,
+                getLineColor: updateTriggers.getLineColor,
+                getLineWidth: updateTriggers.getLineWidth
+            }
+        };
+    }
+    _renderPolygonLayer() {
+        const { data, getHexagon, updateTriggers, coverage } = this.props;
+        const SubLayerClass = this.getSubLayerClass('hexagon-cell-hifi', PolygonLayer);
+        const forwardProps = this._getForwardProps();
+        forwardProps.updateTriggers.getPolygon = mergeTriggers(updateTriggers.getHexagon, coverage);
+        return new SubLayerClass(forwardProps, this.getSubLayerProps({
+            id: 'hexagon-cell-hifi',
+            updateTriggers: forwardProps.updateTriggers
+        }), {
+            data,
+            _normalize: false,
+            _windingOrder: 'CCW',
+            positionFormat: 'XY',
+            getPolygon: (object, objectInfo) => {
+                const hexagonId = getHexagon(object, objectInfo);
+                return h3ToPolygon(hexagonId, coverage, true);
+            }
+        });
+    }
+    _renderColumnLayer() {
+        const { data, getHexagon, updateTriggers } = this.props;
+        const SubLayerClass = this.getSubLayerClass('hexagon-cell', ColumnLayer);
+        const forwardProps = this._getForwardProps();
+        forwardProps.updateTriggers.getPosition = updateTriggers.getHexagon;
+        return new SubLayerClass(forwardProps, this.getSubLayerProps({
+            id: 'hexagon-cell',
+            flatShading: true,
+            updateTriggers: forwardProps.updateTriggers
+        }), {
+            data,
+            diskResolution: 6,
+            radius: 1,
+            vertices: this.state.vertices,
+            getPosition: getHexagonCentroid.bind(null, getHexagon)
+        });
+    }
+}
+H3HexagonLayer.defaultProps = defaultProps;
+H3HexagonLayer.layerName = 'H3HexagonLayer';

package/typed/index.js

@@ -0,0 +1,33 @@
+// 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.
+/* eslint-disable max-len */
+export { default as GreatCircleLayer } from './great-circle-layer/great-circle-layer';
+export { default as S2Layer } from './s2-layer/s2-layer';
+export { default as QuadkeyLayer } from './quadkey-layer/quadkey-layer';
+export { default as TileLayer } from './tile-layer/tile-layer';
+export { default as TripsLayer } from './trips-layer/trips-layer';
+export { default as H3ClusterLayer } from './h3-layers/h3-cluster-layer';
+export { default as H3HexagonLayer } from './h3-layers/h3-hexagon-layer';
+export { default as Tile3DLayer } from './tile-3d-layer/tile-3d-layer';
+export { default as TerrainLayer } from './terrain-layer/terrain-layer';
+export { default as MVTLayer } from './mvt-layer/mvt-layer';
+export { getURLFromTemplate as _getURLFromTemplate } from './tile-layer/utils';
+export { default as _Tileset2D } from './tile-layer/tileset-2d';
+export { default as _Tile2DHeader } from './tile-layer/tile-2d-header';

package/typed/mesh-layer/mesh-layer-fragment.glsl.js

@@ -0,0 +1,55 @@
+export default `#version 300 es
+#define SHADER_NAME simple-mesh-layer-fs
+
+precision highp float;
+
+uniform bool hasTexture;
+uniform sampler2D sampler;
+uniform bool flatShading;
+uniform float opacity;
+
+in vec2 vTexCoord;
+in vec3 cameraPosition;
+in vec3 normals_commonspace;
+in vec4 position_commonspace;
+in vec4 vColor;
+
+out vec4 fragColor;
+
+void main(void) {
+  
+#ifdef MODULE_PBR
+
+  fragColor = vColor * pbr_filterColor(vec4(0));
+  geometry.uv = pbr_vUV;
+  fragColor.a *= opacity;
+
+#else
+
+  geometry.uv = vTexCoord;
+
+  vec3 normal;
+  if (flatShading) {
+
+// NOTE(Tarek): This is necessary because
+// headless.gl reports the extension as
+// available but does not support it in
+// the shader.
+#ifdef DERIVATIVES_AVAILABLE
+    normal = normalize(cross(dFdx(position_commonspace.xyz), dFdy(position_commonspace.xyz)));
+#else
+    normal = vec3(0.0, 0.0, 1.0);
+#endif
+  } else {
+    normal = normals_commonspace;
+  }
+
+  vec4 color = hasTexture ? texture(sampler, vTexCoord) : vColor;
+  vec3 lightColor = lighting_getLightColor(color.rgb, cameraPosition, position_commonspace.xyz, normal);
+  fragColor = vec4(lightColor, color.a * opacity);
+
+#endif
+
+  DECKGL_FILTER_COLOR(fragColor, geometry);
+}
+`;

package/typed/mesh-layer/mesh-layer-vertex.glsl.js

@@ -0,0 +1,80 @@
+export default `#version 300 es
+#define SHADER_NAME simple-mesh-layer-vs
+
+// Scale the model
+uniform float sizeScale;
+uniform bool composeModelMatrix;
+uniform bool u_pickFeatureIds;
+
+// Primitive attributes
+in vec3 positions;
+in vec3 normals;
+in vec3 colors;
+in vec2 texCoords;
+in vec4 uvRegions;
+in vec3 featureIdsPickingColors;
+
+// Instance attributes
+in vec4 instanceColors;
+in vec3 instancePickingColors;
+in mat3 instanceModelMatrix;
+
+// Outputs to fragment shader
+out vec2 vTexCoord;
+out vec3 cameraPosition;
+out vec3 normals_commonspace;
+out vec4 position_commonspace;
+out vec4 vColor;
+
+vec2 applyUVRegion(vec2 uv) {
+  #ifdef HAS_UV_REGIONS
+    // https://github.com/Esri/i3s-spec/blob/master/docs/1.7/geometryUVRegion.cmn.md
+    return fract(uv) * (uvRegions.zw - uvRegions.xy) + uvRegions.xy;
+  #else
+    return uv;
+  #endif
+}
+
+void main(void) {
+  vec2 uv = applyUVRegion(texCoords);
+  geometry.uv = uv;
+
+  if (u_pickFeatureIds) {
+    geometry.pickingColor = featureIdsPickingColors;
+  } else {
+    geometry.pickingColor = instancePickingColors;
+  }
+
+  vTexCoord = uv;
+  cameraPosition = project_uCameraPosition;
+  vColor = vec4(colors * instanceColors.rgb, instanceColors.a);
+
+  vec3 pos = (instanceModelMatrix * positions) * sizeScale;
+  vec3 projectedPosition = project_position(positions);
+  position_commonspace = vec4(projectedPosition, 1.0);
+  gl_Position = project_common_position_to_clipspace(position_commonspace);
+
+  geometry.position = position_commonspace;
+  normals_commonspace = project_normal(instanceModelMatrix * normals);
+  geometry.normal = normals_commonspace;
+
+  DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
+
+  #ifdef MODULE_PBR
+    // set PBR data
+    pbr_vPosition = geometry.position.xyz;
+    #ifdef HAS_NORMALS
+      pbr_vNormal = geometry.normal;
+    #endif
+
+    #ifdef HAS_UV
+      pbr_vUV = uv;
+    #else
+      pbr_vUV = vec2(0., 0.);
+    #endif
+    geometry.uv = pbr_vUV;
+  #endif
+
+  DECKGL_FILTER_COLOR(vColor, geometry);
+}
+`;

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

@@ -2,7 +2,7 @@ import type { NumericArray } from '@math.gl/core';
 import { GLTFMaterialParser } from '@luma.gl/experimental';
 import { Model } from '@luma.gl/core';
 import type { MeshAttribute, MeshAttributes } from '@loaders.gl/schema';
-import type { UpdateParameters, DefaultProps } from '@deck.gl/core/typed';
+import type { UpdateParameters, DefaultProps, LayerContext } from '@deck.gl/core/typed';
 import { SimpleMeshLayer, SimpleMeshLayerProps } from '@deck.gl/mesh-layers/typed';
 export declare type Mesh = {
     attributes: MeshAttributes;
@@ -32,6 +32,7 @@ export default class MeshLayer<DataT = any, ExtraProps = {}> extends SimpleMeshL
     updatePbrMaterialUniforms(pbrMaterial: any): void;
     parseMaterial(pbrMaterial: any, mesh: any): GLTFMaterialParser;
     calculateFeatureIdsPickingColors(attribute: any): void;
+    finalizeState(context: LayerContext): void;
 }
 export {};
 //# sourceMappingURL=mesh-layer.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"mesh-layer.d.ts","sourceRoot":"","sources":["../../src/mesh-layer/mesh-layer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,eAAe,CAAC;AAChD,OAAO,EAAC,kBAAkB,EAAC,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAC,KAAK,EAAM,MAAM,eAAe,CAAC;AAEzC,OAAO,KAAK,EAAC,aAAa,EAAE,cAAc,EAAC,MAAM,oBAAoB,CAAC;AACtE,OAAO,KAAK,EAAC,gBAAgB,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AAClE,OAAO,EAAC,eAAe,EAAE,oBAAoB,EAAC,MAAM,sBAAsB,CAAC;AAK3E,oBAAY,IAAI,GAAG;IACjB,UAAU,EAAE,cAAc,CAAC;IAC3B,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB,CAAC;AAcF,6CAA6C;AAC7C,oBAAY,cAAc,CAAC,KAAK,GAAG,GAAG,IAAI,eAAe,CAAC,KAAK,CAAC,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;AAE/F,qCAAqC;AACrC,aAAK,eAAe,CAAC,KAAK,IAAI;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,GAAG,CAAC;IAElB;;OAEG;IACH,UAAU,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;CAClC,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,SAAS,CAAC,KAAK,GAAG,GAAG,EAAE,UAAU,GAAG,EAAE,CAAE,SAAQ,eAAe,CAClF,KAAK,EACL,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,GAAG,UAAU,CAC9C;IACC,MAAM,CAAC,SAAS,SAAe;IAC/B,MAAM,CAAC,YAAY,oCAAgB;IAEnC,UAAU;IAOV,eAAe;IAmBf,WAAW,CAAC,MAAM,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAS1C,IAAI,CAAC,IAAI,KAAA;IAeT,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,KAAK;IAqBrC,yBAAyB,CAAC,WAAW,KAAA;IASrC,aAAa,CAAC,WAAW,KAAA,EAAE,IAAI,KAAA;IAe/B,gCAAgC,CAAC,SAAS,KAAA;CAgB3C"}
+{"version":3,"file":"mesh-layer.d.ts","sourceRoot":"","sources":["../../src/mesh-layer/mesh-layer.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,eAAe,CAAC;AAChD,OAAO,EAAC,kBAAkB,EAAC,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAC,KAAK,EAAM,MAAM,eAAe,CAAC;AAEzC,OAAO,KAAK,EAAC,aAAa,EAAE,cAAc,EAAC,MAAM,oBAAoB,CAAC;AACtE,OAAO,KAAK,EAAC,gBAAgB,EAAE,YAAY,EAAE,YAAY,EAAC,MAAM,eAAe,CAAC;AAChF,OAAO,EAAC,eAAe,EAAE,oBAAoB,EAAC,MAAM,sBAAsB,CAAC;AAK3E,oBAAY,IAAI,GAAG;IACjB,UAAU,EAAE,cAAc,CAAC;IAC3B,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB,CAAC;AAcF,6CAA6C;AAC7C,oBAAY,cAAc,CAAC,KAAK,GAAG,GAAG,IAAI,eAAe,CAAC,KAAK,CAAC,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAC;AAE/F,qCAAqC;AACrC,aAAK,eAAe,CAAC,KAAK,IAAI;IAC5B;;OAEG;IACH,WAAW,CAAC,EAAE,GAAG,CAAC;IAElB;;OAEG;IACH,UAAU,CAAC,EAAE,YAAY,GAAG,IAAI,CAAC;CAClC,CAAC;AAEF,MAAM,CAAC,OAAO,OAAO,SAAS,CAAC,KAAK,GAAG,GAAG,EAAE,UAAU,GAAG,EAAE,CAAE,SAAQ,eAAe,CAClF,KAAK,EACL,QAAQ,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,GAAG,UAAU,CAC9C;IACC,MAAM,CAAC,SAAS,SAAe;IAC/B,MAAM,CAAC,YAAY,oCAAgB;IAEnC,UAAU;IAOV,eAAe;IAmBf,WAAW,CAAC,MAAM,EAAE,gBAAgB,CAAC,IAAI,CAAC;IAS1C,IAAI,CAAC,IAAI,KAAA;IAeT,SAAS,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,GAAG,KAAK;IAuBrC,yBAAyB,CAAC,WAAW,KAAA;IAWrC,aAAa,CAAC,WAAW,KAAA,EAAE,IAAI,KAAA;IAkB/B,gCAAgC,CAAC,SAAS,KAAA;IAiB1C,aAAa,CAAC,OAAO,EAAE,YAAY;CAMpC"}