feat(bokeh): implement scatter-categorical

[github-actions]

Implementation: scatter-categorical - bokeh

Implements the bokeh version of scatter-categorical.

File: plots/scatter-categorical/implementations/bokeh.py

---

🤖 impl-generate workflow

[claude]

AI Review - Attempt 1/3

Image Description

The plot displays a categorical scatter plot with three distinct clusters representing Product A (blue), Product B (yellow/gold), and Product C (coral/red). The x-axis shows "Marketing Spend ($K)" ranging from about 10 to 100, and the y-axis shows "Customer Engagement Score" ranging from about 20 to 90. Product A cluster is in the lower-left (low spend, low engagement), Product B is in the upper-middle (medium spend, high engagement), and Product C is on the right side with moderate engagement. The title follows the correct format "scatter-categorical · bokeh · pyplots.ai". A legend in the top-right corner identifies the three products. The background is a light gray (#fafafa) with subtle dashed grid lines.

Quality Score: 92/100

Criteria Checklist

Visual Quality (36/40 pts)

• VQ-01: Text Legibility (10/10) - Title, axis labels, and tick marks are all clearly readable at the large canvas size
• VQ-02: No Overlap (8/8) - No overlapping text elements, all labels fully readable
• VQ-03: Element Visibility (7/8) - Markers are well-sized (size=25) with good alpha (0.7), appropriate for 150 points
• VQ-04: Color Accessibility (5/5) - Blue, yellow, and red are colorblind-safe and highly distinguishable
• VQ-05: Layout Balance (4/5) - Good use of canvas, though legend could be slightly better integrated
• VQ-06: Axis Labels (2/2) - Descriptive labels with units: "Marketing Spend ($K)" and "Customer Engagement Score"
• VQ-07: Grid & Legend (0/2) - Grid is subtle (alpha 0.3), but legend appears somewhat separated from plot area

Spec Compliance (25/25 pts)

• SC-01: Plot Type (8/8) - Correct categorical scatter plot
• SC-02: Data Mapping (5/5) - X/Y correctly assigned with categorical grouping
• SC-03: Required Features (5/5) - All spec features present: distinct colors, legend, alpha transparency
• SC-04: Data Range (3/3) - Axes show all data points without clipping
• SC-05: Legend Accuracy (2/2) - Legend correctly maps colors to Product A/B/C
• SC-06: Title Format (2/2) - Correct format: "scatter-categorical · bokeh · pyplots.ai"

Data Quality (18/20 pts)

• DQ-01: Feature Coverage (7/8) - Shows three distinct clusters with different patterns, though could show more overlap for demonstrating alpha
• DQ-02: Realistic Context (7/7) - Marketing spend vs customer engagement is a plausible, neutral business scenario
• DQ-03: Appropriate Scale (4/5) - Values are reasonable, though engagement scores could use units or clearer context

Code Quality (10/10 pts)

• CQ-01: KISS Structure (3/3) - Clean imports → data → plot → save structure, no functions/classes
• CQ-02: Reproducibility (3/3) - Uses np.random.seed(42)
• CQ-03: Clean Imports (2/2) - All imports are used
• CQ-04: No Deprecated API (1/1) - Current Bokeh API
• CQ-05: Output Correct (1/1) - Saves as plot.png and plot.html

Library Features (3/5 pts)

• LF-01: Uses distinctive library features (3/5) - Uses ColumnDataSource, hover tooltips, and interactive tools (pan, zoom, etc.), but could leverage more Bokeh-specific features like linked brushing

Strengths

• Excellent text sizing for the large canvas (48pt title, 36pt axis labels, 28pt tick labels)
• Clean three-cluster visualization with distinct, colorblind-safe colors
• Good use of Bokeh's interactive tools (hover tooltips with formatted values)
• Proper use of ColumnDataSource for data management
• Realistic business context (marketing spend vs engagement)
• Saves both PNG and interactive HTML output

Weaknesses

• Legend placement could be better integrated with the plot (currently appears slightly isolated in top-right)
• Could demonstrate alpha transparency more effectively by having some overlapping points between categories
• Library features usage is good but not exceptional (could use linked selections or custom hover styling)

Verdict: APPROVED

[claude]

AI Review - Attempt 1/3

Image Description

The plot displays a categorical scatter plot with three distinct product categories (Product A, Product B, Product C) shown in three different colors. Product A (blue, #306998) forms a cluster in the lower-left region with Marketing Spend around 15-35 $K and Customer Engagement Scores around 15-40. Product B (yellow, #FFD43B) occupies the upper-middle area with Marketing Spend around 35-65 $K and engagement scores of 55-90. Product C (red/coral, #E74C3C) is positioned on the right side with Marketing Spend around 65-100 $K and engagement scores of 35-65. The title "scatter-categorical · bokeh · pyplots.ai" appears at the top. Axis labels are clear: "Marketing Spend ($K)" on x-axis and "Customer Engagement Score" on y-axis. A legend in the top-right corner identifies each category. The background is a subtle off-white (#fafafa) with dashed grid lines.

Quality Score: 92/100

Criteria Checklist

Visual Quality (36/40 pts)

• VQ-01: Text Legibility (10/10) - Title, axis labels, and tick labels are all clearly readable at the 4800x2700 resolution with appropriately large font sizes (48pt title, 36pt axis labels, 28pt ticks)
• VQ-02: No Overlap (8/8) - No overlapping text elements; all labels, ticks, and legend are well-separated
• VQ-03: Element Visibility (7/8) - Markers are well-sized (size=25) with good alpha (0.7) for 150 points; white outline helps distinguish overlapping points. Slightly smaller than optimal for this point count.
• VQ-04: Color Accessibility (5/5) - Blue, yellow, and red are colorblind-safe with good luminance contrast between categories
• VQ-05: Layout Balance (4/5) - Good use of canvas space; plot area fills most of the image with balanced margins. Legend placement is good but could be slightly better integrated.
• VQ-06: Axis Labels (2/2) - Descriptive labels with units: "Marketing Spend ($K)" and "Customer Engagement Score"
• VQ-07: Grid & Legend (0/2) - Grid is subtle (alpha=0.3, dashed). However, the legend appears outside the plot area in the margin with small bokeh toolbar icons visible, which is slightly distracting.

Spec Compliance (25/25 pts)

• SC-01: Plot Type (8/8) - Correct scatter plot with categorical coloring
• SC-02: Data Mapping (5/5) - X and Y continuous variables correctly mapped, category determines color
• SC-03: Required Features (5/5) - All spec features present: distinct colors per category, legend for identification, alpha transparency for overlapping points
• SC-04: Data Range (3/3) - All data points visible within axis ranges
• SC-05: Legend Accuracy (2/2) - Legend correctly maps colors to Product A, B, C
• SC-06: Title Format (2/2) - Correct format: "scatter-categorical · bokeh · pyplots.ai"

Data Quality (18/20 pts)

• DQ-01: Feature Coverage (7/8) - Shows three distinct clusters demonstrating categorical grouping well. Could show more overlap between categories to demonstrate the utility of categorical coloring in ambiguous regions.
• DQ-02: Realistic Context (7/7) - Marketing spend vs customer engagement is a plausible, neutral business scenario
• DQ-03: Appropriate Scale (4/5) - Values are realistic (marketing spend in $K, engagement scores 0-100), though some engagement scores could be slightly higher to use more of the y-axis range

Code Quality (10/10 pts)

• CQ-01: KISS Structure (3/3) - Clean imports → data → plot → save structure, no functions or classes
• CQ-02: Reproducibility (3/3) - np.random.seed(42) is set
• CQ-03: Clean Imports (2/2) - All imports are used
• CQ-04: No Deprecated API (1/1) - Using current Bokeh API
• CQ-05: Output Correct (1/1) - Saves as plot.png (and plot.html for interactivity)

Library Features (3/5 pts)

• LF-01: Uses distinctive library features (3/5) - Uses ColumnDataSource, hover tooltips, interactive tools (pan, wheel_zoom, box_zoom, reset, save), and exports both PNG and HTML. Good use of Bokeh's interactivity, but could leverage more advanced features like linked brushing or custom callbacks.

Strengths

• Excellent text legibility with well-scaled fonts for the 4800x2700 resolution
• Clean, well-separated clusters that clearly demonstrate categorical grouping
• Good use of Bokeh's interactive features including hover tooltips with formatted values
• Colorblind-safe color palette with good contrast between categories
• Proper KISS code structure with reproducible random seed
• Both PNG and interactive HTML outputs provided

Weaknesses

• Legend appears in margin area with visible Bokeh toolbar icons, creating slight visual distraction
• Marker size could be slightly larger for better visibility at this data density
• Categories are too well-separated; some overlap would better demonstrate the utility of categorical coloring

Verdict: APPROVED