feat(bokeh): implement subplot-mosaic

[github-actions]

Implementation: subplot-mosaic - bokeh

Implements the bokeh version of subplot-mosaic.

File: plots/subplot-mosaic/implementations/bokeh.py

Parent Issue: #3002

---

🤖 impl-generate workflow

[claude]

AI Review - Attempt 1/3

Image Description

The plot displays a mosaic dashboard layout with 6 panels arranged in an asymmetric grid.

• Top row: A large "Quarterly Revenue Overview" line chart (spanning ~2/3 width) showing a blue line with scatter points plotting Revenue ($) vs Day (1-90), alongside a smaller "Product Profitability" scatter plot (yellow circles with blue outlines) plotting Profit Margin (%) vs Units Sold.
• Middle row: A "Sales by Category" bar chart (blue bars for Electronics, Clothing, Food, Books) on the left, and two smaller stacked charts on the right: "Conversion Rate (%)" line chart and "Customer Satisfaction" bar chart (yellow bars for Q1-Q4).
• Bottom row: A full-width "subplot-mosaic · bokeh · pyplots.ai" line chart showing Orders vs Month (1-12) with blue line and yellow scatter points.
  The color palette uses Python Blue (#306998) and Python Yellow (#FFD43B) consistently. Grid lines are dashed and subtle. All text is legible.

Quality Score: 88/100

Criteria Checklist

Visual Quality (35/40 pts)

• VQ-01: Text Legibility (9/10) - All text readable; titles 22-32pt, axis labels 16-22pt, tick labels 14-18pt. Slightly smaller on the mini charts but still acceptable.
• VQ-02: No Overlap (8/8) - No overlapping text elements detected. Category labels slightly rotated to avoid overlap.
• VQ-03: Element Visibility (7/8) - Markers and lines appropriately sized for data density. Scatter plot markers could be slightly larger in the mini charts.
• VQ-04: Color Accessibility (5/5) - Python Blue and Yellow palette is colorblind-safe with good contrast.
• VQ-05: Layout Balance (4/5) - Good mosaic arrangement but some panels have slight alignment inconsistencies.
• VQ-06: Axis Labels (2/2) - All axes have descriptive labels with units where appropriate (Revenue ($), Profit Margin (%), Sales ($), Orders).
• VQ-07: Grid & Legend (0/2) - No legends present (not strictly needed), but grid is well-implemented with dashed lines and alpha 0.3.

Spec Compliance (22/25 pts)

• SC-01: Plot Type (8/8) - Correct mosaic subplot layout with varying panel sizes implemented.
• SC-02: Data Mapping (5/5) - X/Y correctly assigned for all subplot types.
• SC-03: Required Features (4/5) - Shows multiple plot types (line, scatter, bar), varying sizes, but does not demonstrate empty cells with placeholder characters as mentioned in spec.
• SC-04: Data Range (3/3) - All axes show complete data ranges.
• SC-05: Legend Accuracy (0/2) - No legends provided; panel titles serve this purpose but formal legends absent.
• SC-06: Title Format (2/2) - Uses correct format "subplot-mosaic · bokeh · pyplots.ai" on bottom panel.

Data Quality (18/20 pts)

• DQ-01: Feature Coverage (6/8) - Shows line, scatter, and bar charts in various sizes, but missing some features like empty cells/gaps mentioned in spec.
• DQ-02: Realistic Context (7/7) - Excellent business dashboard scenario with revenue, profitability, sales by category, conversion rates, and customer satisfaction.
• DQ-03: Appropriate Scale (5/5) - All values are realistic: revenue in $50k range, profit margins 10-40%, sales $18k-45k, orders 1200-2800.

Code Quality (10/10 pts)

• CQ-01: KISS Structure (3/3) - Clean imports → data → plot → save structure. Uses ColumnDataSource correctly.
• CQ-02: Reproducibility (3/3) - np.random.seed(42) set at the beginning.
• CQ-03: Clean Imports (2/2) - All imports are used: numpy, bokeh.io, bokeh.layouts, bokeh.models, bokeh.plotting.
• CQ-04: No Deprecated API (1/1) - Uses current Bokeh API.
• CQ-05: Output Correct (1/1) - Saves as plot.png via export_png.

Library Features (3/5 pts)

• LF-01: Distinctive Features (3/5) - Uses Bokeh's ColumnDataSource correctly, row/column layouts, and figure configurations. Could leverage more advanced features like HoverTool or linked panning.

Strengths

• Excellent use of Bokeh's row/column layout system to create mosaic-style arrangements
• Professional business dashboard scenario with realistic data across 6 panels
• Consistent styling with Python Blue/Yellow color palette
• Good font sizing for high-resolution output
• Clean KISS code structure with proper ColumnDataSource usage
• Varied plot types (line, scatter, bar) demonstrating mosaic flexibility

Weaknesses

• Missing empty cell demonstration using placeholder characters (spec mentions "." for gaps)
• No legends on individual panels (minor issue since titles are descriptive)
• Grid line styling applied panel-by-panel rather than using a theme

Verdict: REJECTED

[github-actions]

🔧 Repair Attempt 1/3

Applied fixes based on AI review feedback.

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

---

🤖 impl-repair

[claude]

AI Review - Attempt 2/3

Image Description

The plot displays a business dashboard mosaic layout with 6 subplots of varying sizes:

1. Top-left (large, ~2/3 width): "Quarterly Revenue Overview" - Blue line chart with markers showing daily revenue ($50k-$62k) over 90 days
2. Top-right (~1/3 width): "Product Profitability" - Scatter plot with blue (Premium Line) and yellow (Standard Line) dots showing profit margin vs units sold
3. Middle-left (~half width): "Sales by Category" - Blue vertical bar chart for Electronics, Clothing, Food, Books
4. Middle-right top (small): "Conversion Rate (%)" - Line chart with blue and yellow lines tracking weekly conversion rates
5. Middle-right bottom (small): "Customer Satisfaction" - Yellow bar chart showing quarterly scores (Q1-Q4: 78-88)
6. Bottom (full width): Main title "subplot-mosaic · bokeh · pyplots.ai" - Dual line chart comparing 2023 (blue) vs 2024 (green) monthly orders

Colors: Python Blue (#306998), Python Yellow (#FFD43B), Accent Green (#4CAF50). Legends present on most subplots. Dashed subtle grids. Clean professional appearance.

Quality Score: 90/100

Criteria Checklist

Visual Quality (35/40 pts)

• VQ-01: Text Legibility (7/10) - Titles and major labels readable; some smaller subplot labels could be larger
• VQ-02: No Overlap (8/8) - No overlapping text anywhere
• VQ-03: Element Visibility (7/8) - Good marker/line sizing for data density
• VQ-04: Color Accessibility (5/5) - Colorblind-safe palette (blue/yellow/green)
• VQ-05: Layout Balance (4/5) - Excellent mosaic demonstration; good use of space
• VQ-06: Axis Labels (2/2) - Labels include units: Revenue ($), Profit Margin (%), Sales ($), Score
• VQ-07: Grid & Legend (2/2) - Subtle dashed grids (alpha 0.3), well-placed legends

Spec Compliance (24/25 pts)

• SC-01: Plot Type (8/8) - Correct mosaic layout with varying subplot sizes
• SC-02: Data Mapping (5/5) - X/Y correctly assigned across all subplots
• SC-03: Required Features (4/5) - Multiple plot types (line, scatter, bar), different sizes, cell spanning. Empty cell gap feature partially implemented.
• SC-04: Data Range (3/3) - All axes show complete data
• SC-05: Legend Accuracy (2/2) - Accurate legends with meaningful labels
• SC-06: Title Format (2/2) - Correct format "subplot-mosaic · bokeh · pyplots.ai"

Data Quality (20/20 pts)

• DQ-01: Feature Coverage (8/8) - Excellent variety: time series, scatter, bars, comparisons, trends
• DQ-02: Realistic Context (7/7) - Business dashboard scenario is realistic and neutral
• DQ-03: Appropriate Scale (5/5) - Realistic values (revenue $50-60k, margins 5-45%, satisfaction 78-88%)

Code Quality (8/10 pts)

• CQ-01: KISS Structure (2/3) - Has apply_theme() helper function; defines unused data sources (source_e1, source_e2)
• CQ-02: Reproducibility (3/3) - Uses np.random.seed(42)
• CQ-03: Clean Imports (1/2) - Theme is imported but only used to define an unused theme variable; apply_theme uses direct attribute assignment instead
• CQ-04: No Deprecated API (1/1) - Uses current Bokeh API
• CQ-05: Output Correct (1/1) - Saves as plot.png

Library Features (3/5 pts)

• LF-01: Uses distinctive library features (3/5) - Good use of row/column layouts, ColumnDataSource, Legend/LegendItem, Spacer; could add linked axes or hover tools

Strengths

• Excellent demonstration of mosaic layout concept with 6 diverse subplots of varying sizes
• Cohesive visual design with Python brand colors (blue/yellow) and consistent styling
• Realistic business dashboard scenario with meaningful metrics (revenue, profitability, sales, satisfaction)
• Good use of Bokeh's row/column layout system to create asymmetric grid
• Legends are consistently styled with appropriate font sizes and background alpha
• All subplots have clear, descriptive titles and axis labels with units

Weaknesses

• Code defines unused data sources (source_e1, source_e2 for conversion rate) that clutter the implementation
• The Theme object is imported and defined but never applied via curdoc; apply_theme() duplicates this functionality
• Helper function apply_theme() breaks KISS principle; grid styling could be inlined
• Font sizes on smaller subplots (conversion rate, satisfaction) could be slightly larger for better readability
• Could demonstrate Bokeh's interactive features (hover tools, linked brushing) for richer dashboard experience

Verdict: APPROVED