Layers UBO

modules/extensions/src/path-style/shaders.glsl.ts

@@ -18,9 +18,6 @@ uniform pathStyleUniforms {
   bool dashGapPickable;
 } pathStyle;
 
-// TODO Defined in path-layer shader, port with PathLayer
-uniform float capType;
-
 in vec2 vDashArray;
 in float vDashOffset;
 `,
@@ -51,7 +48,7 @@ in float vDashOffset;
     float unitOffset = mod(vPathPosition.y + offset, unitLength);
 
     if (gapLength > 0.0 && unitOffset > solidLength) {
-      if (capType <= 0.5) {
+      if (path.capType <= 0.5) {
         if (!(pathStyle.dashGapPickable && bool(picking.isActive))) {
           discard;
         }

modules/geo-layers/src/trips-layer/trips-layer.ts

@@ -120,14 +120,11 @@ if(fadeTrail) {
 
   draw(params) {
     const {fadeTrail, trailLength, currentTime} = this.props;
+    const uniforms = {fadeTrail, trailLength, currentTime};
 
-    params.uniforms = {
-      ...params.uniforms,
-      fadeTrail,
-      trailLength,
-      currentTime
-    };
-
+    // TODO port to UBO with rest of geo-layers
+    const model = this.state.model!;
+    model.setUniforms(uniforms);
     super.draw(params);
   }
 }

modules/layers/src/arc-layer/arc-layer-uniforms.ts

@@ -0,0 +1,39 @@
+import {ShaderModule} from '@luma.gl/shadertools';
+import {UniformTypes} from '@deck.gl/core';
+
+const uniformBlock = `\
+uniform arcUniforms {
+  bool greatCircle;
+  bool useShortestPath;
+  float numSegments;
+  float widthScale;
+  float widthMinPixels;
+  float widthMaxPixels;
+  highp int widthUnits;
+} arc;
+`;
+
+export type ArcProps = {
+  greatCircle: boolean;
+  useShortestPath: boolean;
+  numSegments: number;
+  widthScale: number;
+  widthMinPixels: number;
+  widthMaxPixels: number;
+  widthUnits: number;
+};
+
+export const arcUniforms = {
+  name: 'arc',
+  vs: uniformBlock,
+  fs: uniformBlock,
+  uniformTypes: {
+    greatCircle: 'f32',
+    useShortestPath: 'f32',
+    numSegments: 'f32',
+    widthScale: 'f32',
+    widthMinPixels: 'f32',
+    widthMaxPixels: 'f32',
+    widthUnits: 'i32'
+  } as const satisfies UniformTypes<ArcProps>
+} as const satisfies ShaderModule<ArcProps>;

modules/layers/src/arc-layer/arc-layer-vertex.glsl.ts

@@ -33,15 +33,6 @@ in float instanceWidths;
 in float instanceHeights;
 in float instanceTilts;
 
-uniform bool greatCircle;
-uniform bool useShortestPath;
-uniform float numSegments;
-uniform float opacity;
-uniform float widthScale;
-uniform float widthMinPixels;
-uniform float widthMaxPixels;
-uniform int widthUnits;
-
 out vec4 vColor;
 out vec2 uv;
 out float isValid;
@@ -82,7 +73,7 @@ vec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction, float width
 }
 
 float getSegmentRatio(float index) {
-  return smoothstep(0.0, 1.0, index / (numSegments - 1.0));
+  return smoothstep(0.0, 1.0, index / (arc.numSegments - 1.0));
 }
 
 vec3 interpolateFlat(vec3 source, vec3 target, float segmentRatio) {
@@ -147,7 +138,7 @@ void main(void) {
   float segmentSide = mod(float(gl_VertexID), 2.) == 0. ? -1. : 1.;
   float segmentRatio = getSegmentRatio(segmentIndex);
   float prevSegmentRatio = getSegmentRatio(max(0.0, segmentIndex - 1.0));
-  float nextSegmentRatio = getSegmentRatio(min(numSegments - 1.0, segmentIndex + 1.0));
+  float nextSegmentRatio = getSegmentRatio(min(arc.numSegments - 1.0, segmentIndex + 1.0));
 
   // if it's the first point, use next - current as direction
   // otherwise use current - prev
@@ -163,7 +154,7 @@ void main(void) {
   vec3 source;
   vec3 target;
 
-  if ((greatCircle || project.projectionMode == PROJECTION_MODE_GLOBE) && project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
+  if ((arc.greatCircle || project.projectionMode == PROJECTION_MODE_GLOBE) && project.coordinateSystem == COORDINATE_SYSTEM_LNGLAT) {
     source = project_globe_(vec3(instanceSourcePositions.xy, 0.0));
     target = project_globe_(vec3(instanceTargetPositions.xy, 0.0));
     float angularDist = getAngularDist(instanceSourcePositions.xy, instanceTargetPositions.xy);
@@ -199,7 +190,7 @@ void main(void) {
   } else {
     vec3 source_world = instanceSourcePositions;
     vec3 target_world = instanceTargetPositions;
-    if (useShortestPath) {
+    if (arc.useShortestPath) {
       source_world.x = mod(source_world.x + 180., 360.0) - 180.;
       target_world.x = mod(target_world.x + 180., 360.0) - 180.;
 
@@ -213,7 +204,7 @@ void main(void) {
     // common x at longitude=-180
     float antiMeridianX = 0.0;
 
-    if (useShortestPath) {
+    if (arc.useShortestPath) {
       if (project.projectionMode == PROJECTION_MODE_WEB_MERCATOR_AUTO_OFFSET) {
         antiMeridianX = -(project.coordinateOrigin.x + 180.) / 360. * TILE_SIZE;
       }
@@ -230,7 +221,7 @@ void main(void) {
     vec3 currPos = interpolateFlat(source, target, segmentRatio);
     vec3 nextPos = interpolateFlat(source, target, nextSegmentRatio);
 
-    if (useShortestPath) {
+    if (arc.useShortestPath) {
       if (nextPos.x < antiMeridianX) {
         currPos.x += TILE_SIZE;
         nextPos.x += TILE_SIZE;
@@ -245,8 +236,8 @@ void main(void) {
   // Multiply out width and clamp to limits
   // mercator pixels are interpreted as screen pixels
   float widthPixels = clamp(
-    project_size_to_pixel(instanceWidths * widthScale, widthUnits),
-    widthMinPixels, widthMaxPixels
+    project_size_to_pixel(instanceWidths * arc.widthScale, arc.widthUnits),
+    arc.widthMinPixels, arc.widthMaxPixels
   );
 
   // extrude
@@ -258,7 +249,7 @@ void main(void) {
   gl_Position = curr + vec4(project_pixel_size_to_clipspace(offset.xy), 0.0, 0.0);
 
   vec4 color = mix(instanceSourceColors, instanceTargetColors, segmentRatio);
-  vColor = vec4(color.rgb, color.a * opacity);
+  vColor = vec4(color.rgb, color.a * layer.opacity);
   DECKGL_FILTER_COLOR(vColor, geometry);
 }
 `;

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

@@ -36,6 +36,7 @@ import {
 
 import {Model} from '@luma.gl/engine';
 
+import {arcUniforms, ArcProps} from './arc-layer-uniforms';
 import vs from './arc-layer-vertex.glsl';
 import fs from './arc-layer-fragment.glsl';
 
@@ -163,7 +164,7 @@ export default class ArcLayer<DataT = any, ExtraPropsT extends {} = {}> extends
   }
 
   getShaders() {
-    return super.getShaders({vs, fs, modules: [project32, picking]}); // 'project' module added by default.
+    return super.getShaders({vs, fs, modules: [project32, picking, arcUniforms]}); // 'project' module added by default.
   }
 
   // This layer has its own wrapLongitude logic
@@ -246,18 +247,18 @@ export default class ArcLayer<DataT = any, ExtraPropsT extends {} = {}> extends
       wrapLongitude,
       numSegments
     } = this.props;
-    const model = this.state.model!;
-
-    model.setUniforms(uniforms);
-    model.setUniforms({
+    const arcProps: ArcProps = {
       numSegments,
-      greatCircle,
       widthUnits: UNIT[widthUnits],
       widthScale,
       widthMinPixels,
       widthMaxPixels,
+      greatCircle,
       useShortestPath: wrapLongitude
-    });
+    };
+
+    const model = this.state.model!;
+    model.shaderInputs.setProps({arc: arcProps});
     model.setVertexCount(numSegments * 2);
     model.draw(this.context.renderPass);
   }

modules/layers/src/bitmap-layer/bitmap-layer-uniforms.ts

@@ -17,11 +17,11 @@ type BitmapBindingProps = {
 };
 
 type BitmapUniformProps = {
-  bounds?: [number, number, number, number];
-  coordinateConversion?: number;
-  desaturate?: number;
-  tintColor?: [number, number, number];
-  transparentColor?: [number, number, number, number];
+  bounds: [number, number, number, number];
+  coordinateConversion: number;
+  desaturate: number;
+  tintColor: [number, number, number];
+  transparentColor: [number, number, number, number];
 };
 
 export type BitmapProps = BitmapBindingProps & BitmapUniformProps;

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

@@ -303,8 +303,6 @@ export default class BitmapLayer<ExtraPropsT extends {} = {}> extends Layer<
         tintColor: tintColor.slice(0, 3).map(x => x / 255) as [number, number, number],
         transparentColor: transparentColor.map(x => x / 255) as [number, number, number, number]
       };
-      // TODO remove setUniforms() - currently DataFilterExtension needs this
-      model.setUniforms(uniforms);
       model.shaderInputs.setProps({bitmap: bitmapProps});
       model.draw(this.context.renderPass);
     }

modules/layers/src/column-layer/column-layer-fragment.glsl.ts

@@ -23,9 +23,6 @@ export default `#version 300 es
 
 precision highp float;
 
-uniform bool extruded;
-uniform bool isStroke;
-
 out vec4 fragColor;
 
 in vec4 vColor;
@@ -39,7 +36,7 @@ void main(void) {
   // Fails to compile on some Android devices if geometry is never assigned (#8411)
   geometry.uv = vec2(0.);
 #ifdef FLAT_SHADING
-  if (extruded && !isStroke && !bool(picking.isActive)) {
+  if (column.extruded && !column.isStroke && !bool(picking.isActive)) {
     vec3 normal = normalize(cross(dFdx(position_commonspace.xyz), dFdy(position_commonspace.xyz)));
     fragColor.rgb = lighting_getLightColor(vColor.rgb, cameraPosition, position_commonspace.xyz, normal);
   }

modules/layers/src/column-layer/column-layer-uniforms.ts

@@ -0,0 +1,60 @@
+import {ShaderModule} from '@luma.gl/shadertools';
+import {UniformTypes} from '@deck.gl/core';
+
+const uniformBlock = `\
+uniform columnUniforms {
+  float radius;
+  float angle;
+  vec2 offset;
+  bool extruded;
+  bool stroked;
+  bool isStroke;
+  float coverage;
+  float elevationScale;
+  float edgeDistance;
+  float widthScale;
+  float widthMinPixels;
+  float widthMaxPixels;
+  highp int radiusUnits;
+  highp int widthUnits;
+} column;
+`;
+
+export type ColumnProps = {
+  radius: number;
+  angle: number;
+  offset: [number, number];
+  extruded: boolean;
+  stroked: boolean;
+  isStroke: boolean;
+  coverage: number;
+  elevationScale: number;
+  edgeDistance: number;
+  widthScale: number;
+  widthMinPixels: number;
+  widthMaxPixels: number;
+  radiusUnits: number;
+  widthUnits: number;
+};
+
+export const columnUniforms = {
+  name: 'column',
+  vs: uniformBlock,
+  fs: uniformBlock,
+  uniformTypes: {
+    radius: 'f32',
+    angle: 'f32',
+    offset: 'vec2<f32>',
+    extruded: 'f32',
+    stroked: 'f32',
+    isStroke: 'f32',
+    coverage: 'f32',
+    elevationScale: 'f32',
+    edgeDistance: 'f32',
+    widthScale: 'f32',
+    widthMinPixels: 'f32',
+    widthMaxPixels: 'f32',
+    radiusUnits: 'i32',
+    widthUnits: 'i32'
+  } as const satisfies UniformTypes<Required<ColumnProps>>
+} as const satisfies ShaderModule<ColumnProps>;