@perspective-dev/viewer-charts 4.3.0

package/src/ts/shaders/density-resolve.frag.glsl

@@ -0,0 +1,89 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+precision highp float;
+
+uniform sampler2D u_heat;
+uniform sampler2D u_extreme;
+uniform sampler2D u_gradient_lut;
+
+// Saturation knob shared by every mode. `density` maps it onto hue,
+// `mean` / `extreme` map it onto alpha, `signed` uses it as the
+// signed-sum denominator.
+uniform float u_heat_max;
+
+// 0 = density-only (color column ignored)
+// 1 = mean (density-weighted average of color-t)
+// 2 = extreme (sign-aware max-blended deviation)
+// 3 = signed (net positive vs net negative accumulation)
+uniform int u_color_mode;
+
+varying vec2 v_uv;
+
+void main() {
+    vec4 sd = texture2D(u_heat, v_uv);
+    float density = sd.r;
+    float weighted = sd.g;
+
+    if(density <= 0.0) {
+        discard;
+    }
+
+    float t;
+    float alpha;
+    float n = clamp(density / max(u_heat_max, 1e-4), 0.0, 1.0);
+
+    if(u_color_mode == 0) {
+        // Density only: gamma-curve clamped density into the hue
+        // axis. Alpha follows raw density so a single splat fades
+        // smoothly into the plot background.
+        t = pow(n, 0.6);
+        alpha = clamp(density, 0.0, 1.0);
+    } else if(u_color_mode == 2) {
+        // Extreme: signed max of `t - 0.5` is split across R (positive
+        // deviation) and G (negative deviation magnitude); whichever
+        // is larger wins the sign. Falls back to neutral if neither
+        // contributed at this pixel.
+        vec4 ext = texture2D(u_extreme, v_uv);
+        float pos = ext.r;
+        float neg = ext.g;
+        float winner = max(pos, neg);
+        if(winner <= 0.0) {
+            t = 0.5;
+        } else if(pos >= neg) {
+            t = clamp(0.5 + pos * 0.5, 0.5, 1.0);
+        } else {
+            t = clamp(0.5 - neg * 0.5, 0.0, 0.5);
+        }
+        alpha = n;
+    } else if(u_color_mode == 3) {
+        // Signed sum: each splat additively contributes `w * t`, so
+        // the per-pixel signed sum (relative to the neutral midpoint)
+        // is `Σ w(t-0.5) = G - 0.5·R`. Sign drives which half of the
+        // LUT we land in, magnitude/heat_max drives both saturation
+        // and alpha.
+        float signed_sum = weighted - 0.5 * density;
+        float mag = clamp(abs(signed_sum) / max(u_heat_max, 1e-4), 0.0, 1.0);
+        float dir = signed_sum >= 0.0 ? 1.0 : -1.0;
+        t = clamp(0.5 + 0.5 * dir * mag, 0.0, 1.0);
+        alpha = mag;
+    } else {
+        // Mean (mode 1, default): density-weighted average of per-
+        // point color-t, with density driving alpha so sparse
+        // pixels fade out.
+        t = clamp(weighted / density, 0.0, 1.0);
+        alpha = n;
+    }
+
+    vec4 color = texture2D(u_gradient_lut, vec2(t, 0.5));
+    gl_FragColor = vec4(color.rgb, color.a * alpha);
+}

package/src/ts/shaders/density-resolve.vert.glsl

@@ -0,0 +1,23 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+// Fullscreen triangle covering NDC `[-1, 1]^2`. Drawn with
+// `drawArrays(TRIANGLES, 0, 3)`; the lone triangle's overscan rasterizes
+// every pixel exactly once and replaces the standard two-triangle quad.
+attribute vec2 a_corner;
+
+varying vec2 v_uv;
+
+void main() {
+    v_uv = a_corner * 0.5 + 0.5;
+    gl_Position = vec4(a_corner, 0.0, 1.0);
+}

package/src/ts/shaders/density-splat.frag.glsl

@@ -0,0 +1,34 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+precision highp float;
+
+uniform float u_intensity;
+
+varying vec2 v_uv;
+varying float v_color_t;
+
+void main() {
+    // Radial falloff. `length(v_uv)` is `1.0` at the disk edge.
+    // `pow(...)^2` matches the WGSL reference splat shape.
+    float r = length(v_uv);
+    float w = max(0.0, 1.0 - r);
+    w = w * w * u_intensity;
+    if(w <= 0.0) {
+        discard;
+    }
+
+    // R: accumulated density. G: density-weighted color-t. The resolve
+    // pass divides G/R to recover the per-pixel weighted-average t.
+    // Blend func at the call site is `(gl.ONE, gl.ONE)` (additive).
+    gl_FragColor = vec4(w, w * v_color_t, 0.0, 0.0);
+}

package/src/ts/shaders/density-splat.vert.glsl

@@ -0,0 +1,52 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+// Per-vertex (divisor 0): unit-quad corner in `[(-1,-1), (1,-1), (-1,1), (1,1)]`.
+attribute vec2 a_corner;
+
+// Per-instance (divisor 1): data-space xy of the splat center.
+attribute vec2 a_position;
+
+// Per-instance (divisor 1): raw color column value. Folded into a
+// sign-aware `t` matching the scatter glyph for cross-chart parity.
+attribute float a_color_value;
+
+// Splat radius expressed in NDC. Computed CPU-side as
+// `(radius_px * dpr * 2) / plot_pixel_width` so the disk maintains a
+// fixed pixel footprint as the user zooms.
+uniform vec2 u_radius_ndc;
+
+uniform mat4 u_projection;
+uniform vec2 u_color_range;
+varying vec2 v_uv;
+varying float v_color_t;
+
+void main() {
+    // Project the data-space center into clip space, then offset by the
+    // unit-quad corner scaled by `u_radius_ndc`. This keeps splats
+    // axis-aligned to the screen regardless of zoom level.
+    vec4 center = u_projection * vec4(a_position, 0.0, 1.0);
+    gl_Position = center + vec4(a_corner * u_radius_ndc * center.w, 0.0, 0.0);
+
+    v_uv = a_corner;
+
+    float cmin = u_color_range.x;
+    float cmax = u_color_range.y;
+    if(cmax <= cmin) {
+        v_color_t = 0.5;
+    } else if(cmin < 0.0 && cmax > 0.0) {
+        float denom = max(-cmin, cmax);
+        v_color_t = clamp(0.5 + 0.5 * (a_color_value / denom), 0.0, 1.0);
+    } else {
+        v_color_t = clamp((a_color_value - cmin) / (cmax - cmin), 0.0, 1.0);
+    }
+}

package/src/ts/shaders/gridline.frag.glsl

@@ -0,0 +1,18 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+precision mediump float;
+uniform vec4 u_color;
+
+void main() {
+    gl_FragColor = u_color;
+}

package/src/ts/shaders/gridline.vert.glsl

@@ -0,0 +1,18 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+attribute vec2 a_position;
+uniform mat4 u_projection;
+
+void main() {
+    gl_Position = u_projection * vec4(a_position, 0.0, 1.0);
+}

package/src/ts/shaders/heatmap.frag.glsl

@@ -0,0 +1,23 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+precision highp float;
+
+uniform sampler2D u_gradient_lut;
+
+varying float v_color_t;
+
+void main() {
+    float t = clamp(v_color_t, 0.0, 1.0);
+    vec4 rgba = texture2D(u_gradient_lut, vec2(t, 0.5));
+    gl_FragColor = vec4(rgba.rgb, 1.0);
+}

package/src/ts/shaders/heatmap.vert.glsl

@@ -0,0 +1,42 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+// Unit-quad corner per vertex: (0,0) bottom-left → (1,1) top-right.
+attribute vec2 a_corner;
+
+// Per-instance: cell center (data units) + normalized color t in [0, 1].
+// In category mode the center is the integer index `(xIdx, yIdx)`; in
+// numeric mode the JS uploader pre-multiplies into real data values
+// (e.g. ms-since-epoch).
+attribute vec2 a_cell;
+attribute float a_color_t;
+uniform mat4 u_projection;
+
+// Inset applied in data-space so the shader can carve a pixel-accurate
+// gap between neighbouring cells regardless of plot size.
+uniform vec2 u_cell_inset;
+
+// Cell size in data units. `(1.0, 1.0)` for the integer category grid;
+// in numeric mode the bandWidth derived from min adjacent delta.
+uniform vec2 u_cell_size;
+varying float v_color_t;
+
+void main() {
+    // Cell `c` occupies [c - half, c + half] on each axis. Inset shrinks
+    // the rendered rect inward by `u_cell_inset` on all sides.
+    vec2 half_size = 0.5 * u_cell_size;
+    vec2 span = u_cell_size - 2.0 * u_cell_inset;
+    float x = a_cell.x - half_size.x + u_cell_inset.x + a_corner.x * span.x;
+    float y = a_cell.y - half_size.y + u_cell_inset.y + a_corner.y * span.y;
+    gl_Position = u_projection * vec4(x, y, 0.0, 1.0);
+    v_color_t = a_color_t;
+}

package/src/ts/shaders/line-uniform.frag.glsl

@@ -0,0 +1,26 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+precision highp float;
+
+uniform vec4 u_color;
+uniform float u_line_width;
+
+varying float v_edge_dist;
+
+void main() {
+    float dist = abs(v_edge_dist);
+    float coreEdge = u_line_width / (u_line_width + 1.5);
+    float alpha = 1.0 - smoothstep(coreEdge, 1.0, dist);
+
+    gl_FragColor = vec4(u_color.rgb, u_color.a * alpha);
+}

package/src/ts/shaders/line-uniform.vert.glsl

@@ -0,0 +1,54 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+// Uniform-color line shader used by bar's line-glyph overlay. The
+// LineChart pipeline uses `line.vert.glsl` instead, which drives color
+// from a per-point series-id + gradient LUT. Bar pre-computes one
+// `s.color` per series from its own palette resolver, so a uniform
+// is the right fit here.
+attribute vec2 a_start;
+attribute vec2 a_end;
+
+// Per-vertex attribute (advance every vertex, divisor=0)
+// 0 = start+left, 1 = start+right, 2 = end+left, 3 = end+right
+attribute float a_corner;
+
+uniform mat4 u_projection;
+uniform vec2 u_resolution;
+uniform float u_line_width;
+
+varying float v_edge_dist;
+
+void main() {
+    vec4 clipStart = u_projection * vec4(a_start, 0.0, 1.0);
+    vec4 clipEnd = u_projection * vec4(a_end, 0.0, 1.0);
+
+    vec2 pixelStart = clipStart.xy * u_resolution * 0.5;
+    vec2 pixelEnd = clipEnd.xy * u_resolution * 0.5;
+
+    vec2 dir = pixelEnd - pixelStart;
+    float segLen = length(dir);
+    dir = segLen > 0.001 ? dir / segLen : vec2(1.0, 0.0);
+
+    vec2 normal = vec2(-dir.y, dir.x);
+
+    float isEnd = step(1.5, a_corner);
+    float side = 1.0 - mod(a_corner, 2.0) * 2.0;
+
+    vec4 clipPos = mix(clipStart, clipEnd, isEnd);
+
+    float halfWidth = (u_line_width + 1.5) * 0.5;
+    vec2 clipOffset = (normal * side * halfWidth) / (u_resolution * 0.5);
+
+    gl_Position = clipPos + vec4(clipOffset, 0.0, 0.0);
+    v_edge_dist = side;
+}

package/src/ts/shaders/line.frag.glsl

@@ -0,0 +1,28 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+precision highp float;
+
+uniform float u_line_width;
+
+varying float v_edge_dist;
+varying vec3 v_color;
+
+void main() {
+    // |v_edge_dist| ranges from 0 (line centre) to 1 (outer AA fringe edge).
+    // The solid core of the line extends to coreEdge; beyond that we fade out.
+    float dist = abs(v_edge_dist);
+    float coreEdge = u_line_width / (u_line_width + 1.5);
+    float alpha = 1.0 - smoothstep(coreEdge, 1.0, dist);
+
+    gl_FragColor = vec4(v_color, alpha);
+}

package/src/ts/shaders/line.vert.glsl

@@ -0,0 +1,87 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+// Per-instance attributes (advance once per segment via divisor=1).
+// Both `a_start`/`a_end` and `a_color_start`/`a_color_end` read from
+// the same flat buffers using overlapping offsets: instance i reads
+// vertex[i] into `*_start` and vertex[i+1] into `*_end`. Each per-
+// series draw call binds into its own slot range, so segments never
+// cross series boundaries — the CPU-side rebinding in `drawLineSeries`
+// is the safeguard, so the shader contains no discard branch.
+//
+// `a_color_start` / `a_color_end` carry the segment endpoints' raw
+// color values (numeric data value for gradient, dictionary index for
+// categorical). The gradient LUT is sampled using the same mapping the
+// scatter shader uses — `(v - cmin) / (cmax - cmin)` with sign-aware
+// handling for zero-crossing domains. The two endpoints' colors are
+// averaged so the segment reads as a single chord in gradient space.
+attribute vec2 a_start;
+attribute vec2 a_end;
+attribute float a_color_start;
+attribute float a_color_end;
+
+// Per-vertex attribute (advance every vertex, divisor=0)
+// 0 = start+left, 1 = start+right, 2 = end+left, 3 = end+right
+attribute float a_corner;
+
+uniform mat4 u_projection;
+uniform vec2 u_resolution;
+uniform float u_line_width;
+uniform vec2 u_color_range;
+uniform sampler2D u_gradient_lut;
+
+varying float v_edge_dist;
+varying vec3 v_color;
+
+float colorT(float v, float cmin, float cmax) {
+    if(cmax <= cmin) {
+        return 0.5;
+    } else if(cmin < 0.0 && cmax > 0.0) {
+        float denom = max(-cmin, cmax);
+        return clamp(0.5 + 0.5 * (v / denom), 0.0, 1.0);
+    }
+    return clamp((v - cmin) / (cmax - cmin), 0.0, 1.0);
+}
+
+void main() {
+    // Average the two endpoints so the segment takes one color — keeps
+    // the fragment shader cheap (no interpolated t sample) and matches
+    // the single-tone feel of the old per-series palette.
+    float cmin = u_color_range.x;
+    float cmax = u_color_range.y;
+    float avgVal = 0.5 * (a_color_start + a_color_end);
+    float t = colorT(avgVal, cmin, cmax);
+    v_color = texture2D(u_gradient_lut, vec2(t, 0.5)).rgb;
+
+    vec4 clipStart = u_projection * vec4(a_start, 0.0, 1.0);
+    vec4 clipEnd = u_projection * vec4(a_end, 0.0, 1.0);
+
+    vec2 pixelStart = clipStart.xy * u_resolution * 0.5;
+    vec2 pixelEnd = clipEnd.xy * u_resolution * 0.5;
+
+    vec2 dir = pixelEnd - pixelStart;
+    float segLen = length(dir);
+    dir = segLen > 0.001 ? dir / segLen : vec2(1.0, 0.0);
+
+    vec2 normal = vec2(-dir.y, dir.x);
+
+    float isEnd = step(1.5, a_corner);
+    float side = 1.0 - mod(a_corner, 2.0) * 2.0;
+
+    vec4 clipPos = mix(clipStart, clipEnd, isEnd);
+
+    float halfWidth = (u_line_width + 1.5) * 0.5;
+    vec2 clipOffset = (normal * side * halfWidth) / (u_resolution * 0.5);
+
+    gl_Position = clipPos + vec4(clipOffset, 0.0, 0.0);
+    v_edge_dist = side;
+}

package/src/ts/shaders/scatter.frag.glsl

@@ -0,0 +1,39 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+precision highp float;
+
+varying float v_color_t;
+varying float v_point_size;
+
+uniform sampler2D u_gradient_lut;
+
+void main() {
+    // Distance from center of point sprite in [0, 0.5] space
+    vec2 coord = gl_PointCoord - vec2(0.5);
+    float dist = length(coord);
+
+    // Discard fragments clearly outside the circle
+    if(dist > 0.5) {
+        discard;
+    }
+
+    // Anti-alias: smooth falloff over ~1.5 screen pixels at the edge.
+    // In point-coord space, 1 pixel = 1/v_point_size.
+    float pixelWidth = 1.5 / max(v_point_size, 1.0);
+    float alpha = 1.0 - smoothstep(0.5 - pixelWidth, 0.5, dist);
+
+    // LUT lookup — t is already sign-aware (pre-baked CPU-side via
+    // `colorValueToT`), so the shader is a pure sampler.
+    vec4 color = texture2D(u_gradient_lut, vec2(clamp(v_color_t, 0.0, 1.0), 0.5));
+    gl_FragColor = vec4(color.rgb, color.a * alpha);
+}

package/src/ts/shaders/scatter.vert.glsl

@@ -0,0 +1,67 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+attribute vec2 a_position;
+attribute float a_color_value;
+attribute float a_size_value;
+
+uniform mat4 u_projection;
+uniform float u_point_size;
+// Data extents of the color column. The vertex shader folds these into a
+// sign-aware `t` whose 50% stop is always the sign pivot, matching the
+// CPU-side `colorValueToT` helper used by heatmap and the Canvas2D
+// legend / tooltip.
+uniform vec2 u_color_range;
+uniform vec2 u_size_range;
+uniform vec2 u_point_size_range;
+
+varying float v_color_t;
+varying float v_point_size;
+
+void main() {
+    // No unused-slot discard: tight per-series draws in `points.ts`
+    // already bound `gl.drawArrays(gl.POINTS, s*cap, count[s])` to
+    // valid rows, so the shader never sees a tail slot. A historical
+    // sentinel branch here culled `a_color_value < 0.0`, which under
+    // current dispatch silently dropped real numeric color data
+    // whenever the user's color column legitimately went negative
+    // (e.g., a diverging `Profit` column).
+    gl_Position = u_projection * vec4(a_position, 0.0, 1.0);
+
+    float sizeRange = u_size_range.y - u_size_range.x;
+    if(sizeRange > 0.0) {
+        float size_t = clamp((a_size_value - u_size_range.x) / sizeRange, 0.0, 1.0);
+        gl_PointSize = mix(u_point_size_range.x, u_point_size_range.y, size_t);
+    } else {
+        gl_PointSize = u_point_size;
+    }
+
+    v_point_size = gl_PointSize;
+
+    // Color-t mapping. Linear across `[cmin, cmax]` for single-sign
+    // domains (which includes categorical `[0, N-1]` split / string
+    // indices, so the colors match `interpolatePalette`'s even sampling
+    // used by the legend). When the domain actually crosses zero we
+    // switch to sign-aware so the value 0 always lands at the 50% stop
+    // of the diverging gradient — matching heatmap and the Canvas2D
+    // tooltip paths.
+    float cmin = u_color_range.x;
+    float cmax = u_color_range.y;
+    if(cmax <= cmin) {
+        v_color_t = 0.5;
+    } else if(cmin < 0.0 && cmax > 0.0) {
+        float denom = max(-cmin, cmax);
+        v_color_t = clamp(0.5 + 0.5 * (a_color_value / denom), 0.0, 1.0);
+    } else {
+        v_color_t = clamp((a_color_value - cmin) / (cmax - cmin), 0.0, 1.0);
+    }
+}