feat(bokeh): implement streamgraph-basic

[github-actions]

Implementation: streamgraph-basic - python/bokeh

Implements the python/bokeh version of streamgraph-basic.

File: plots/streamgraph-basic/implementations/python/bokeh.py

Parent Issue: #856

---

🤖 impl-generate workflow

[claude]

AI Review - Attempt 1/3

Image Description

Light render (plot-light.png): The plot displays a classic streamgraph on a warm off-white (#FAF8F1) background. Six smooth flowing bands represent music genres: Pop (brand green #009E73) at the bottom, Rock (vermillion #D55E00), Hip-Hop (blue #0072B2), Electronic (reddish purple #CC79A7), Jazz (orange #E69F00), and Classical (sky blue #56B4E9) at the top. The symmetric baseline centers the stack around y=0, with the y-axis spanning approximately -100 to +100. The title "streamgraph-basic · bokeh · anyplot.ai" is visible at top-left. Y-axis tick labels (-100, -50, 0, 50, 100) and the "Streaming Hours (relative)" axis label are clearly visible in dark ink. A legend panel sits outside the plot on the right. X-axis date labels are present at the bottom but compressed in the thumbnail. All text is readable against the light background. No light-on-light failures.

Dark render (plot-dark.png): Same streamgraph on a warm near-black (#1A1A17) background. The six data band colors are identical to the light render — Okabe-Ito positions 1–6 remain constant. All chrome (title, axis labels, tick labels, legend text) is correctly flipped to light colors (consistent with INK and INK_SOFT dark-mode tokens). The legend background renders in the dark elevated tone (#242420). Y-axis tick labels appear clearly in a warm light gray against the dark background. No dark-on-dark text failures observed. Border fill color correctly matches the plot background, creating a seamless dark canvas.

Both paragraphs are required. A review that only describes one render is invalid.

Score: 88/100

Category	Score	Max
Visual Quality	28	30
Design Excellence	11	20
Spec Compliance	15	15
Data Quality	15	15
Code Quality	10	10
Library Mastery	9	10
Total	88	100

Visual Quality (28/30)

• VQ-01: Text Legibility (7/8) — Font sizes explicitly set (32pt title, 24pt axis labels, 18pt ticks). All text clearly readable in both themes. Minor: x-axis date labels at the very bottom edge of the viewport are difficult to confirm in thumbnail but present in code with correct font size.
• VQ-02: No Overlap (6/6) — Streaming bands flow smoothly; no label or band collisions.
• VQ-03: Element Visibility (6/6) — All 6 bands clearly distinguishable at fill_alpha=0.85 with line borders; prominent at full resolution.
• VQ-04: Color Accessibility (2/2) — Okabe-Ito palette is CVD-safe; no red-green pairing as sole signal.
• VQ-05: Layout & Canvas (3/4) — Good 16:9 proportions; legend correctly placed outside. Minor: streams extend close to top/bottom plot edges, leaving minimal vertical breathing room.
• VQ-06: Axis Labels & Title (2/2) — Title correctly formatted as "streamgraph-basic · bokeh · anyplot.ai"; y-axis labelled "Streaming Hours (relative)"; x-axis labelled "Time".
• VQ-07: Palette Compliance (2/2) — First series (Pop) = #009E73 ✓; full Okabe-Ito order followed; light background #FAF8F1, dark background #1A1A17; both renders theme-correct.

Design Excellence (11/20)

• DE-01: Aesthetic Sophistication (5/8) — Clean professional streamgraph; Okabe-Ito colors with alpha blending, well-placed external legend, subtle grid (10% alpha), no figure outline. Raised above default for deliberate palette and layout choices.
• DE-02: Visual Refinement (3/6) — outline_line_color=None removes the figure box; grid at 10% alpha is very subtle; legend with custom glyph sizes and spacing. Raised from default.
• DE-03: Data Storytelling (3/6) — Smooth flowing curves effectively communicate genre trend dynamics; symmetric baseline creates visual balance. No annotations or callouts guiding specific insights.

Spec Compliance (15/15)

• SC-01: Plot Type (5/5) — Correct streamgraph with symmetric baseline centered around y=0; organic river-like appearance matches spec.
• SC-02: Required Features (4/4) — Smooth interpolation ✓, symmetric centered baseline ✓, distinct harmonious colors ✓, legend ✓.
• SC-03: Data Mapping (3/3) — X=datetime time axis ✓, Y=streaming hours (relative, centered) ✓, all 24 time points covered.
• SC-04: Title & Legend (3/3) — Title matches format; legend labels (Pop, Rock, Hip-Hop, Electronic, Jazz, Classical) correct.

Data Quality (15/15)

• DQ-01: Feature Coverage (6/6) — Demonstrates all key streamgraph aspects: smooth curves, symmetric baseline, 6 categories (within 3–8 spec range), 24 time points (within 10–100 range).
• DQ-02: Realistic Context (5/5) — Monthly music genre streaming data is realistic, relatable, and culturally neutral.
• DQ-03: Appropriate Scale (4/4) — Per-genre base values of 14–45 hours/month with sinusoidal variation are plausible; 2-year time range is appropriate.

Code Quality (10/10)

• CQ-01: KISS Structure (3/3) — No functions or classes; clean top-to-bottom script.
• CQ-02: Reproducibility (2/2) — np.random.seed(42) set.
• CQ-03: Clean Imports (2/2) — All imports (os, time, Path, numpy, pandas, bokeh components, selenium) are actively used.
• CQ-04: Code Elegance (2/2) — No fake UI; polynomial smoothing is functional and concise; clear section comments.
• CQ-05: Output & API (1/1) — Saves plot-{THEME}.html and plot-{THEME}.png correctly.

Library Mastery (9/10)

• LM-01: Idiomatic Usage (5/5) — ColumnDataSource per patch, figure.patch for area rendering, HoverTool via add_tools, Legend model via add_layout — all canonical bokeh patterns.
• LM-02: Distinctive Features (4/5) — Interactive HoverTool showing genre on hover, HTML artifact output, externally-placed Legend model, per-patch ColumnDataSource — distinctly Bokeh. Slightly below max as callbacks/widgets not leveraged.

Score Caps Applied

• None

Strengths

• Complete spec compliance: symmetric baseline streamgraph with smooth curves, all required features present
• Correct Okabe-Ito palette in canonical order; brand green #009E73 as first series (Pop)
• Full theme adaptation: background, borders, text, legend all correctly token-mapped for both light and dark
• Interactive HoverTool displaying genre name on hover — showcases Bokeh's distinctive interactivity
• HTML + PNG dual output following bokeh library requirements
• Proper headless Chrome screenshot via Selenium (correct approach for this environment)
• Clean, reproducible code with seed=42; no functions/classes

Weaknesses

• Polynomial fitting (degree 10 with np.polyfit/np.polyval) for smoothing rather than spline interpolation — high-degree polynomials can cause edge artifacts (Runge's phenomenon) at the leftmost and rightmost time points
• Streaming bands extend close to the top and bottom edges of the plot viewport with minimal visual margin — slight layout breathing-room issue
• No visual hierarchy or focal-point emphasis (e.g., no annotation callout for the most prominent trend, no emphasis on the largest category)

Issues Found

1. DE-03 MODERATE: No focal point or data story emphasis — Fix: Add a subtle text annotation highlighting the dominant genre or a trend crossing point to guide the viewer's eye
2. DE-01 MODERATE: Legend placed but no design hierarchy — Fix: Consider bold-facing the dominant category label or using slightly stronger alpha on the primary band to create visual emphasis

AI Feedback for Next Attempt

Implementation is strong and fully spec-compliant. For the next attempt, consider replacing degree-10 polynomial smoothing with scipy.interpolate.make_interp_spline (cubic B-spline) to avoid potential Runge edge artifacts. Add a data story element — either a subtle annotation on the most interesting trend or slight alpha variation (e.g., 0.9 for the dominant band vs 0.75 for smaller ones) to create visual hierarchy. Optionally increase bottom/top padding in the figure to give the streams more breathing room.

Verdict: APPROVED

[github-actions]

🔧 Repair Workflow Crashed (Attempt 1/4) — Auto-Retrying

The repair workflow failed (probably a transient Claude Code Action issue). Automatically re-triggering this attempt...

---

🤖 impl-repair

[github-actions]

❌ Repair Workflow Crashed (Attempt 1/4, retry exhausted)

The repair workflow itself failed twice for this attempt — likely a persistent Claude Code Action issue.

Manual restart:

gh workflow run impl-repair.yml -f pr_number=5701 -f specification_id=streamgraph-basic -f library=bokeh -f attempt=1

---

🤖 impl-repair

[github-actions]

🔧 Repair Attempt 1/4

Applied fixes based on AI review feedback.

Status: Repair completed, re-triggering review...

---

🤖 impl-repair

[claude]

AI Review - Attempt 2/3

Image Description

Light render (plot-light.png): Rendered on a warm off-white #FAF8F1 surface — correct light theme background fills both the plot area and surrounding border. Title "streamgraph-basic · bokeh · anyplot.ai" is visible at the top left in dark ink (#1A1A17). Y-axis label "Streaming Hours (relative)" is readable (rotated, dark text). Tick labels at -100, -50, 0, 50, 100 appear in INK_SOFT (#4A4A44). Legend sits to the right on an elevated #FFFDF6 panel with readable genre labels. Six smooth flowing streaming bands occupy the plot — Pop (#009E73 brand green, bottommost), Rock (#D55E00 vermillion), Hip-Hop (#0072B2 blue), Electronic (#CC79A7 pink), Jazz (#E69F00 gold), Classical (#56B4E9 sky blue, topmost) — with symmetric baseline correctly centered at y=0. A small "Pop — most-streamed" annotation box is visible in the lower-center area (appears to be a carry-over artifact from a prior iteration not present in the current code). All text is readable against the light background. Legibility verdict: PASS.

Dark render (plot-dark.png): Rendered on a warm near-black #1A1A17 surface — not pure black. Plot background and border fill both correctly set to PAGE_BG. Title text renders in light warm-white (#F0EFE8) — clearly readable against the dark surface. Axis labels use INK token (#F0EFE8), tick labels use INK_SOFT (#B8B7B0). Legend text is light-colored against the #242420 elevated background panel — no dark-on-dark failure. All six stream colors are identical to the light render — only chrome (background, text, legend frame) flipped between themes. The same "Pop — most-streamed" annotation is visible. No black-on-black or dark-on-dark text failures detected. Legibility verdict: PASS.

Score: 86/100

Category	Score	Max
Visual Quality	28	30
Design Excellence	11	20
Spec Compliance	15	15
Data Quality	15	15
Code Quality	10	10
Library Mastery	7	10
Total	86	100

Visual Quality (28/30)

• VQ-01: Text Legibility (7/8) — Font sizes explicitly set (32pt title, 24pt axis labels, 18pt ticks, 22pt legend). All text readable in both themes. Minor: x-axis "Time" label hard to confirm at thumbnail scale.
• VQ-02: No Overlap (6/6) — Streaming bands flow smoothly without collisions; legend fully outside plot area.
• VQ-03: Element Visibility (6/6) — All 6 bands clearly distinguishable at fill_alpha=0.85 with matching line borders.
• VQ-04: Color Accessibility (2/2) — Okabe-Ito palette is CVD-safe; no red-green pairing as sole signal.
• VQ-05: Layout & Canvas (3/4) — Good 16:9 proportions; legend correctly outside. Minor: streams extend close to top/bottom edges; Bokeh toolbar shares space with title.
• VQ-06: Axis Labels & Title (2/2) — Title correctly formatted; y-axis and x-axis labelled with appropriate descriptors.
• VQ-07: Palette Compliance (2/2) — First series (Pop) = #009E73; full Okabe-Ito order positions 1–6; #FAF8F1 light / #1A1A17 dark; both renders theme-correct.

Design Excellence (11/20)

• DE-01: Aesthetic Sophistication (5/8) — Clean professional streamgraph. Raised above default (4) for deliberate choices: outline_line_color=None, subtle 10% grid, ordered streams from dominant to minor genre, alpha blending. Not dramatically sophisticated beyond spec requirements.
• DE-02: Visual Refinement (3/6) — outline_line_color=None removes figure border; grid at 10% alpha is appropriately subtle; legend has custom glyph sizes (40×40). No explicit spine removal. Raised from default (2).
• DE-03: Data Storytelling (3/6) — Smooth flowing curves communicate 2-year genre evolution. Symmetric baseline enables relative comparison. No callout annotation or focal-point emphasis on the dominant genre. Raised from default (2).

Spec Compliance (15/15)

• SC-01: Plot Type (5/5) — Correct streamgraph with symmetric baseline centered at y=0 and smooth flowing curves.
• SC-02: Required Features (4/4) — Smooth interpolation, symmetric baseline, distinct Okabe-Ito colors, legend — all present.
• SC-03: Data Mapping (3/3) — X=datetime (24 months), Y=streaming hours (relative/centered), 6 categories within spec's 3–8 range.
• SC-04: Title & Legend (3/3) — Title matches required format; legend labels match the six music genres.

Data Quality (15/15)

• DQ-01: Feature Coverage (6/6) — All streamgraph aspects demonstrated: multiple categories, varying trend shapes, symmetric stacking.
• DQ-02: Realistic Context (5/5) — Monthly music genre streaming hours over 2 years — realistic, relatable, culturally neutral.
• DQ-03: Appropriate Scale (4/4) — Base values 14–45 hrs/month per genre with sinusoidal variation; 2-year time range appropriate.

Code Quality (10/10)

• CQ-01: KISS Structure (3/3) — No functions or classes; clean flat script.
• CQ-02: Reproducibility (2/2) — np.random.seed(42) set.
• CQ-03: Clean Imports (2/2) — All imported symbols actively used.
• CQ-04: Code Elegance (2/2) — Matrix-based y_bottom/y_top computation is clear. No fake UI.
• CQ-05: Output & API (1/1) — Saves plot-{THEME}.html and plot-{THEME}.png; Selenium/Chrome pattern follows bokeh.md prescription.

Library Mastery (7/10)

• LM-01: Idiomatic Usage (4/5) — ColumnDataSource per patch, p.patch() for filled polygons, HoverTool via add_tools(), Legend model via add_layout() — canonical Bokeh patterns throughout. Raised above default (3).
• LM-02: Distinctive Features (3/5) — Interactive HoverTool with genre tooltip, HTML artifact alongside PNG, externally-placed Legend model with custom glyph sizing. Raised above default (1). Callbacks/widgets not leveraged.

Score Caps Applied

• None

Strengths

• Complete spec compliance: symmetric baseline streamgraph with smooth flowing curves, correctly centered y=0 baseline, and all required features implemented
• Correct Okabe-Ito palette in canonical order with brand green #009E73 as first series (Pop); all 6 positions used correctly
• Full theme adaptation: PAGE_BG, ELEVATED_BG, INK, INK_SOFT tokens applied to background, text, axis lines, tick marks, and legend — both renders are theme-correct
• HoverTool displaying genre name on hover showcases Bokeh's distinctive interactivity; HTML artifact produced alongside PNG
• Clean reproducible flat script: np.random.seed(42), no functions or classes, all imports used, correct Selenium/Chrome screenshot pattern

Weaknesses

• Polynomial fitting (degree 10 via np.polyfit/np.polyval) used for smooth curves rather than true spline interpolation — high-degree polynomials risk Runge phenomenon oscillations at leftmost and rightmost time points
• Streams extend close to top and bottom viewport edges with minimal breathing room — slight y-range expansion or padding would improve visual comfort
• No focal-point emphasis or storytelling annotation: no callout highlighting the dominant genre trend, no emphasis on the most visually interesting pattern

Issues Found

1. DE-03 LOW: No focal-point annotation or visual emphasis on the dominant genre/trend.
   • Fix: Add a Label or Span to highlight the most prominent pattern (e.g., Pop dominance, a genre's peak month)
2. VQ-05 MINOR: Streams sit close to viewport edges; Bokeh toolbar crowds the title area.
   • Fix: Expand y-range slightly (e.g., multiply total span by 1.05) to add breathing room

AI Feedback for Next Attempt

The core implementation is technically strong and spec-compliant. To improve design excellence: (1) Replace np.polyfit with scipy.interpolate.make_interp_spline for better smooth interpolation without edge oscillation risk. (2) Add a Label annotation highlighting the dominant genre or a notable trend peak to create a visual focal point. (3) Expand the y-axis range slightly to prevent streams from clipping at the viewport edges.

Verdict: APPROVED