Port remaining path and polygon layers to WebGPU - #703
Conversation
CoverageStmts: 51.01% ▼-0.02% | Branch: 42.11% | Funcs: 49.15% ▼-0.06% | Lines: 51.12% ▼-0.02%
|
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: c25c1bc718
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| shaders.source = insertBefore( | ||
| shaders.source.replace('let widthPixels =', 'var widthPixels ='), |
There was a problem hiding this comment.
With the pinned deck.gl 9.4.0-alpha.2, PathLayer.getShaders() returns vs, fs, and modules but no source, so every EditablePathLayer initialization—WebGL2 as well as WebGPU—evaluates undefined.replace(...) here and throws before rendering. The WGSL rewrite needs to be conditional or supplied through a shader path that actually defines source.
Useful? React with 👍 / 👎.
| export class RoundedRectangleLayer extends PathBasedRoundedRectangleLayer { | ||
| static layerName = 'RoundedRectangleLayer'; | ||
|
|
||
| draw(props) { | ||
| const {cornerRadius} = this.props as any; | ||
| const roundedRectangleProps: RoundedRectangleProps = {cornerRadius}; | ||
| const model = this.state.model as Model; | ||
| model.shaderInputs.setProps({roundedRectangle: roundedRectangleProps}); | ||
| super.draw(props); | ||
| } | ||
|
|
||
| getShaders() { | ||
| // use object.assign to make sure we don't overwrite existing fields like `vs`, `modules`... | ||
| const shaders = super.getShaders(undefined!); | ||
| return { | ||
| ...shaders, | ||
| fs, | ||
| modules: [...shaders.modules, roundedRectangleUniforms] | ||
| }; | ||
| } | ||
| } |
There was a problem hiding this comment.
When an existing rounded-rectangle style omits the optional cornerRadius, this subclass no longer supplies the previous 0.1 default and the inherited tessellator passes undefined into generateRoundedCorners; its calculations become NaN and return an empty polygon, so the node disappears. An explicit cornerRadius: 0, previously documented as a sharp rectangle, also produces empty geometry, so this implementation needs to preserve the old default and handle zero-radius rectangles.
Useful? React with 👍 / 👎.
| export default function makeImperativeExample( | ||
| {title, code, renderInfo = () => null, mount, parameters, mapStyle, data, deviceTabs}, | ||
| {title, code, renderInfo = () => null, mount, parameters, mapStyle, data, deviceTabs = true}, | ||
| options |
There was a problem hiding this comment.
Defaulting every imperative example to device management also adds a functional WebGPU tab to the Leaflet and Bing Maps galleries, although their mount functions ignore the supplied device and create host-owned WebGL overlays (examples/leaflet/get-started/app.ts and examples/bing-maps/get-started/app.ts). Selecting WebGPU therefore only changes the wrapper's unused managed device while the displayed example remains WebGL, making the backend control misleading; these integrations need to opt out or expose an unsupported state.
Useful? React with 👍 / 👎.
1 participant
Summary
Ports the community layers that were blocked on upstream path and polygon support to WebGPU now that deck.gl 9.4 alpha.2 provides dual-backend
PathLayerandPolygonLayerimplementations.PathStyleExtensionsupplies its own WGSL implementationPolygonLayergeometrybitcastfor baseline WebGPU adapters that do not exposefloat32-filterabledocs/whats-new.mdWhy
The previous community implementations depended on WebGL-only shaders, mesh paths, or upstream path/polygon layers that did not yet have WebGPU implementations. deck.gl 9.4 alpha.2 removes the central path/polygon blocker, allowing these layers to share the upstream renderers across both backends. The integer texture paths also avoid requiring the optional WebGPU
float32-filterablefeature.Making backend selection and support status universal in examples and docs makes the remaining compatibility gaps visible and testable instead of depending on per-page opt-in wiring.
WebGPU porting status
A checkmark means the blocked work is implemented by this PR; the final column records any remaining follow-up beyond this PR's path/polygon scope.
PathOutlineLayer,PathMarkerLayer, and path-modeDependencyArrowLayerPathStyleExtensiongains WGSL.TimelineLayergeometry andHorizonGraphLayerdata texturesTextLayerlabels plus pointer and drag interactions.GraphLayerstyling, images, labels, layouts, and picking.GeoArrowPathLayerandGeoArrowSolidPolygonLayerGeoArrowTripsLayer.FlowPathLayerand animated graph flowsUser impact
Applications can select WebGPU for the newly ported path, polygon, graph, timeline-geometry, GeoArrow, editable-geometry, and wind-particle paths without WebGL-only shader failures. WebGL2 behavior remains supported. Every gallery and live layer example now exposes backend selection, while every docs page displays its current WebGPU support status and links to the compatibility guide.
Validation
yarn lintyarn buildyarn --cwd website buildyarn test-node— 168 files passed; 1,420 tests passed and 9 skippedyarn vitest run --project examples examples/geo-layers/wind/wind-device-tabs.spec.ts— 2 passed