visgl · ibgreen · Jul 30, 2026 · Jul 30, 2026 · Jul 30, 2026
diff --git a/dev/timeline-layers/README.md b/dev/timeline-layers/README.md
@@ -3,7 +3,7 @@
 [![NPM Version](https://img.shields.io/npm/v/@deck.gl-community/timeline-layers.svg)](https://www.npmjs.com/package/@deck.gl-community/timeline-layers)
 [![NPM Downloads](https://img.shields.io/npm/dw/@deck.gl-community/timeline-layers.svg)](https://www.npmjs.com/package/@deck.gl-community/timeline-layers)
 ![deck.gl v9](https://img.shields.io/badge/deck.gl-v9-green.svg?style=flat-square")
-![WebGPU not supported](https://img.shields.io/badge/webgpu-no-red.svg?style=flat-square")
+![WebGPU partially supported](https://img.shields.io/badge/webgpu-partial-yellow.svg?style=flat-square")
 
 Experimental timeline visualization layers for [deck.gl](https://deck.gl), including HorizonGraph primitives and timeline axes/grid utilities for compact time series displays.
 

diff --git a/dev/timeline-layers/src/layers/horizon-graph-layer/horizon-graph-layer.ts b/dev/timeline-layers/src/layers/horizon-graph-layer/horizon-graph-layer.ts
@@ -85,13 +85,16 @@ export class HorizonGraphLayer<ExtraProps extends {} = {}> extends Layer<
     }
 
     // TODO: use the right way to only submit the minimum amount of data
-    const data = new Float32Array(dataTextureSize * dataTextureSize);
-    data.set(_data, 0);
+    const floatData = new Float32Array(dataTextureSize * dataTextureSize);
+    floatData.set(_data, 0);
+    const isWebGpu = device.type === 'webgpu';
 
     return {
       dataTexture: device.createTexture({
-        data,
-        format: 'r32float',
+        data: isWebGpu ? new Uint32Array(floatData.buffer) : floatData,
+        // WebGPU float32 textures are unfilterable on baseline adapters. Preserve every float bit
+        // in an integer texture and recover it with bitcast in WGSL; WebGL keeps the sampler path.
+        format: isWebGpu ? 'r32uint' : 'r32float',
         dimension: '2d',
         width: dataTextureSize,
         height: dataTextureSize,

diff --git a/dev/timeline-layers/src/layers/horizon-graph-layer/horizon-graph-layer.wgsl.ts b/dev/timeline-layers/src/layers/horizon-graph-layer/horizon-graph-layer.wgsl.ts
@@ -16,7 +16,7 @@ struct HorizonLayerUniforms {
 };
 
 @group(0) @binding(auto) var<uniform> horizonLayer: HorizonLayerUniforms;
-@group(0) @binding(auto) var dataTexture: texture_2d<f32>;
+@group(0) @binding(auto) var dataTexture: texture_2d<u32>;
 
 struct HorizonAttributes {
   @location(0) positions: vec3<f32>,
@@ -49,8 +49,9 @@ fn fragmentMain(varyings: HorizonVaryings) -> @location(0) vec4<f32> {
   );
   let row = floor(index * horizonLayer.dataTextureSizeInv);
   let column = index - row * horizonLayer.dataTextureSize;
-  let value = textureLoad(dataTexture, vec2<i32>(i32(column), i32(row)), 0).r *
-    horizonLayer.yAxisScaleInv;
+  let value = bitcast<f32>(
+    textureLoad(dataTexture, vec2<i32>(i32(column), i32(row)), 0).r
+  ) * horizonLayer.yAxisScaleInv;
   let scaledBand = abs(value) * horizonLayer.bands;
   let bandIndex = clamp(floor(scaledBand), 0.0, horizonLayer.bands - 1.0);
   let bandFraction = fract(scaledBand);

diff --git a/dev/timeline-layers/src/layers/time-axis-layer.ts b/dev/timeline-layers/src/layers/time-axis-layer.ts
@@ -246,6 +246,12 @@ export class TimeAxisLayer extends CompositeLayer<TimeAxisLayerProps> {
         : configuration.maxX;
     const minorTextColor = withHalfAlpha(configuration.textColor);
     const minorGridColor = withHalfAlpha(configuration.gridColor);
+    const fontProps = {
+      ...(this.props.characterSet === undefined ? {} : {characterSet: this.props.characterSet}),
+      ...(this.props.fontFamily === undefined ? {} : {fontFamily: this.props.fontFamily}),
+      ...(this.props.fontSettings === undefined ? {} : {fontSettings: this.props.fontSettings}),
+      ...(this.props.fontWeight === undefined ? {} : {fontWeight: this.props.fontWeight})
+    };
 
     return [
       configuration.axisLine &&
@@ -285,10 +291,7 @@ export class TimeAxisLayer extends CompositeLayer<TimeAxisLayerProps> {
             getColor: tick => (tick.type === 'major' ? configuration.textColor : minorTextColor),
             getTextAnchor: configuration.legacyRange ? 'middle' : 'start',
             getAlignmentBaseline: configuration.legacyRange ? 'top' : 'bottom',
-            characterSet: this.props.characterSet,
-            fontFamily: this.props.fontFamily,
-            fontSettings: this.props.fontSettings,
-            fontWeight: this.props.fontWeight,
+            ...fontProps,
             updateTriggers: {
               getText: [this.props.formatTick, configuration.mode, configuration.legacyRange]
             }

diff --git a/dev/timeline-layers/test/time-axis-layer.spec.ts b/dev/timeline-layers/test/time-axis-layer.spec.ts
@@ -90,6 +90,7 @@ describe('TimeAxisLayer', () => {
     const tickLabels = layer.renderLayers().find(sublayer => sublayer instanceof TextLayer);
 
     expect(tickLabels).toBeInstanceOf(TextLayer);
+    expect(tickLabels?.props.fontSettings).toEqual({});
   });
 
   it('forwards optional font properties directly to the tick label layer', () => {

diff --git a/docs/modules/arrow-layers/README.md b/docs/modules/arrow-layers/README.md
@@ -1,7 +1,7 @@
 # Overview
 
 ![deck.gl v9](https://img.shields.io/badge/deck.gl-v9-green.svg?style=flat-square")
-![WebGPU not supported](https://img.shields.io/badge/webgpu-no-red.svg?style=flat-square")
+![WebGPU partially supported](https://img.shields.io/badge/webgpu-partial-yellow.svg?style=flat-square")
 
 This module provides deck.gl layers that accept Apache Arrow and [GeoArrow](https://geoarrow.org) tables. 
 These layers take advantage of the deck.gl [low-level binary interface](https://deck.gl/docs/developer-guide/performance#supply-attributes-directly) to provide binary arrow data from Apache Arrow tables directly to the GPU.

diff --git a/docs/modules/editable-layers/README.md b/docs/modules/editable-layers/README.md
@@ -1,7 +1,7 @@
 # Overview
 
 ![deck.gl v9](https://img.shields.io/badge/deck.gl-v9-green.svg?style=flat-square")
-![WebGPU not supported](https://img.shields.io/badge/webgpu-no-red.svg?style=flat-square")
+![WebGPU partially supported](https://img.shields.io/badge/webgpu-partial-yellow.svg?style=flat-square")
 
 Provides a suite of editable deck.gl layers, primarly focused on GeoJSON visualization and editing.
 

diff --git a/docs/modules/geo-layers/README.md b/docs/modules/geo-layers/README.md
@@ -24,9 +24,9 @@ This module exports geospatial deck.gl layers developed by the community.
 ## Wind showcase
 
 :::caution Work in progress
-The wind-layer API and historical showcase are experimental. `ParticleLayer` has verified WebGL2
-and WebGPU GPU simulation. The complete terrain-and-arrows scene remains WebGL2-first because
-upstream terrain, polygon, and path support on WebGPU is still in progress.
+The wind-layer API and historical showcase are experimental. `ParticleLayer`, filled arrows, and
+station-triangulated terrain are verified on WebGL2 and WebGPU. The original image-derived mountain
+terrain remains WebGL2-only because upstream `TerrainLayer` does not yet support WebGPU.
 :::
 
 The [wind showcase guide](./developer-guide/wind-showcase.md) recreates Nicolas Belmonte's

diff --git a/docs/modules/graph-layers/README.md b/docs/modules/graph-layers/README.md
@@ -1,7 +1,7 @@
 # Overview
 
 ![deck.gl v9](https://img.shields.io/badge/deck.gl-v9-green.svg?style=flat-square")
-![WebGPU not supported](https://img.shields.io/badge/webgpu-no-red.svg?style=flat-square")
+![WebGPU partially supported](https://img.shields.io/badge/webgpu-partial-yellow.svg?style=flat-square")
 
 `graph-layers` is a deck.gl layer pack for GPU-powered visualization of large graphs. 
 

diff --git a/docs/modules/graph-layers/api-reference/layers/path-rounded-rectangle-layer.md b/docs/modules/graph-layers/api-reference/layers/path-rounded-rectangle-layer.md
@@ -5,10 +5,9 @@ import LayerLiveExample from '@site/src/components/docs/layer-live-example';
 <LayerLiveExample highlight="path-rounded-rectangle-layer" size="tall" />
 
 `PathBasedRoundedRectangleLayer` renders rounded rectangles by tessellating a
-polygon path. Unlike [`RoundedRectangleLayer`](./rounded-rectangle-layer.md),
-which shaders the rounding in the fragment stage, this layer generates explicit
-geometry using `generateRoundedCorners` so it can work with Deck.gl's standard
-polygon shaders.
+polygon path. `RoundedRectangleLayer` now extends this implementation, so both
+style names generate explicit geometry with `generateRoundedCorners` and use
+deck.gl's standard dual-backend polygon shaders.
 
 ## Usage
 
@@ -34,8 +33,8 @@ const layer = new PathBasedRoundedRectangleLayer({
 });
 ```
 
-Use this renderer when you need rounded rectangles without the custom shader
-module required by `RoundedRectangleLayer`.
+Use this renderer directly for the explicit `path-rounded-rectangle` graph style;
+the regular `rounded-rectangle` style shares the same portable implementation.
 
 ## Properties
 

diff --git a/docs/modules/graph-layers/api-reference/layers/rounded-rectangle-layer.md b/docs/modules/graph-layers/api-reference/layers/rounded-rectangle-layer.md
@@ -5,8 +5,8 @@ import LayerLiveExample from '@site/src/components/docs/layer-live-example';
 <LayerLiveExample highlight="rounded-rectangle-layer" size="tall" />
 
 `RoundedRectangleLayer` renders rectangles with programmable corner radii. It
-extends [`RectangleLayer`](./rectangle-layer.md) and injects a fragment shader
-uniform so each instance can round corners independently.
+CPU-tessellates each rounded outline and renders it through deck.gl's
+dual-backend `PolygonLayer`, so the same geometry works on WebGL2 and WebGPU.
 
 ## Usage
 
@@ -37,19 +37,17 @@ const layer = new RoundedRectangleLayer({
 
 ## Properties
 
-All [`RectangleLayer` props](./rectangle-layer.md#properties) apply, plus the
-options below.
+The options below control the generated polygon geometry.
 
 ### `cornerRadius` (number, optional)
 
-Controls how round each corner should be. The shader expects a normalized value:
-`0` renders a sharp corner while `1` approximates a circle. The stylesheet may
-supply a constant or accessor via the `cornerRadius` attribute.
+Controls the radius of each CPU-tessellated corner in the layer's coordinate
+units. The stylesheet may supply a constant or accessor.
 
 ### `stylesheet` ([`GraphStylesheetEngine`](../internal/graph-stylesheet-engine.md), required)
 
 Must expose `getCornerRadius`, `getWidth`, and `getHeight` accessors so the layer
-can size each node and update its shader uniforms.
+can rebuild each node polygon when its style changes.
 
 ### `positionUpdateTrigger` (any, optional)
 

diff --git a/docs/modules/infovis-layers/README.md b/docs/modules/infovis-layers/README.md
@@ -1,7 +1,7 @@
 # Overview
 
 ![deck.gl v9](https://img.shields.io/badge/deck.gl-v9-green.svg?style=flat-square")
-![WebGPU not supported](https://img.shields.io/badge/webgpu-no-red.svg?style=flat-square")
+![WebGPU partially supported](https://img.shields.io/badge/webgpu-partial-yellow.svg?style=flat-square")
 
 This module provides a suite of layers and view helpers for [deck.gl](https://deck.gl) focused on non-geospatial visualization.
 

diff --git a/docs/modules/layers/README.md b/docs/modules/layers/README.md
@@ -1,7 +1,7 @@
 # Overview
 
 ![deck.gl v9](https://img.shields.io/badge/deck.gl-v9-green.svg?style=flat-square")
-![WebGPU not supported](https://img.shields.io/badge/webgpu-no-red.svg?style=flat-square")
+![WebGPU supported](https://img.shields.io/badge/webgpu-yes-green.svg?style=flat-square")
 
 This module provides a suite of reusable layers for [deck.gl](https://deck.gl).
 The layers in this module are generic primitives that are intended to be usable in both geospatial and non-geospatial visualizations.

diff --git a/docs/modules/layers/api-reference/path-outline-layer.md b/docs/modules/layers/api-reference/path-outline-layer.md
@@ -11,6 +11,9 @@ on top. This keeps the layer on the deck.gl/luma.gl v9 render path while letting
 you emphasize overlapping paths (for example, trails or transit lines) without
 managing multiple layers manually.
 
+The solid and dashed variants are browser-verified on WebGL2 and WebGPU. On WebGPU, the layer
+bridges the currently GLSL-only `PathStyleExtension` with an internal WGSL dash plugin.
+
 Use [`PathMarkerLayer`](./path-marker-layer.md) when you need arrows or other
 markers along a path. The `PathOutlineLayer` is focused purely on the outline
 pass and can be combined with any other overlays.
@@ -80,10 +83,11 @@ your data ordering when outlines overlap. Defaults to `() => 0`.
    `widthScale * outlineWidthScale`.
 2. `path`: rendered second with the original `getColor` and `widthScale`.
 
-When `getDashArray` is supplied, the layer attaches
+When `getDashArray` is supplied on WebGL2, the layer attaches
 `PathStyleExtension({dash: true, highPrecisionDash: true})` unless a caller
-already provided a path-style extension, so `getDashArray` and `dashJustified`
-work on both sublayers. It also disables depth writes and uses
+already provided a path-style extension. WebGPU uses the equivalent internal
+WGSL dash implementation. Both paths support `getDashArray` and `dashJustified`
+on both sublayers. The layer also disables depth writes and uses
 `depthCompare: 'always'` on both passes to avoid z-fighting between colocated
 path strokes.