feat: line layer and project module port to WGSL, test app for WebGPU line (#9509)

Author: ibgreen

examples/vite.config.local.mjs

@@ -30,7 +30,7 @@ export default defineConfig(async () => {
       port: 8080
     },
     optimizeDeps: {
-      esbuildOptions: {target: 'es2020'}
+      esbuildOptions: {target: 'es2022'}
     }
   };
 });

modules/core/src/shaderlib/misc/geometry.ts

@@ -4,8 +4,41 @@
 
 import type {ShaderModule} from '@luma.gl/shadertools';
 
+const source = /* wgsl */ `\
+const SMOOTH_EDGE_RADIUS: f32 = 0.5;
+
+struct VertexGeometry {
+  position: vec4<f32>,
+  worldPosition: vec3<f32>,
+  worldPositionAlt: vec3<f32>,
+  normal: vec3<f32>,
+  uv: vec2<f32>,
+  pickingColor: vec3<f32>,
+};
+
+var<private> geometry_: VertexGeometry = VertexGeometry(
+  vec4<f32>(0.0, 0.0, 1.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0),
+  vec2<f32>(0.0, 0.0),
+  vec3<f32>(0.0, 0.0, 0.0)
+);
+
+struct FragmentGeometry {
+  uv: vec2<f32>,
+};
+
+var<private> fragmentGeometry: FragmentGeometry;
+
+fn smoothedge(edge: f32, x: f32) -> f32 {
+  return smoothstep(edge - SMOOTH_EDGE_RADIUS, edge + SMOOTH_EDGE_RADIUS, x);
+}
+`;
+
 const defines = '#define SMOOTH_EDGE_RADIUS 0.5';
-const vs = `
+
+const vs = /* glsl */ `\
 ${defines}
 
 struct VertexGeometry {
@@ -25,7 +58,7 @@ struct VertexGeometry {
 );
 `;
 
-const fs = `
+const fs = /* glsl */ `\
 ${defines}
 
 struct FragmentGeometry {
@@ -37,4 +70,9 @@ float smoothedge(float edge, float x) {
 }
 `;
 
-export default {name: 'geometry', vs, fs} as const satisfies ShaderModule;
+export default {
+  name: 'geometry',
+  source,
+  vs,
+  fs
+} as const satisfies ShaderModule;

modules/core/src/shaderlib/project/project.glsl.ts

@@ -15,7 +15,7 @@ const UNIT_GLSL_CONSTANTS = Object.keys(UNIT)
   .map(key => `const int UNIT_${key.toUpperCase()} = ${UNIT[key]};`)
   .join('');
 
-export default /* glsl */ `\
+export const projectGLSL = /* glsl */ `\
 ${COORDINATE_SYSTEM_GLSL_CONSTANTS}
 ${PROJECTION_MODE_GLSL_CONSTANTS}
 ${UNIT_GLSL_CONSTANTS}

modules/core/src/shaderlib/project/project.ts

@@ -5,7 +5,8 @@
 import {fp32, ShaderModule} from '@luma.gl/shadertools';
 import geometry from '../misc/geometry';
 import {getUniformsFromViewport} from './viewport-uniforms';
-import projectShaderGLSL from './project.glsl';
+import {projectWGSL} from './project.wgsl';
+import {projectGLSL} from './project.glsl';
 
 import type {ProjectProps, ProjectUniforms} from './viewport-uniforms';
 
@@ -21,7 +22,8 @@ function getUniforms(opts: ProjectProps | {} = INITIAL_MODULE_OPTIONS) {
 export default {
   name: 'project',
   dependencies: [fp32, geometry],
-  vs: projectShaderGLSL,
+  source: projectWGSL,
+  vs: projectGLSL,
   getUniforms,
   uniformTypes: {
     wrapLongitude: 'f32',