feat(plotly): implement bullet-basic

[github-actions]

Implementation: bullet-basic - plotly

Implements the plotly version of bullet-basic.

File: plots/bullet-basic/implementations/plotly.py

Parent Issue: #999

---

🤖 impl-generate workflow

[claude]

AI Review - Attempt 1/3

Image Description

The plot displays four horizontally-oriented bullet charts stacked vertically, each showing a different business metric. Each bullet chart features:

• Background bands: Three grayscale shades (light gray #D9D9D9, medium gray #BFBFBF, darker gray #A6A6A6) representing qualitative ranges (poor/satisfactory/good)
• Primary measure bar: A blue (#306998) horizontal bar showing the actual value
• Target marker: A bold black vertical line indicating the target value
• Value annotation: The actual value displayed in blue on the right side

The four metrics shown are:

1. Revenue ($K): actual=275 (exceeds target of 250)
2. Profit ($K): actual=85 (below target of 100)
3. Customers: actual=320 (below target of 400)
4. Satisfaction: actual=4.2 (below target of 4.5)

Title "bullet-basic · plotly · pyplots.ai" is centered at the top. The layout is clean with appropriate spacing between charts.

Quality Score: 93/100

Criteria Checklist

Spec Compliance (33/35 pts)

• SC-01: Correct plot type (10/10) - Bullet chart correctly implemented with measure bar, target marker, and qualitative ranges
• SC-02: Data mapped correctly (7/7) - Actual values as bars, targets as markers, ranges as background bands
• SC-03: Required features present (7/7) - All spec features: actual bar, target marker, qualitative bands, optional labels
• SC-04: Data range (4/4) - All data visible with appropriate padding (x-axis scaled to 115% of max range)
• SC-05: Legend accuracy (2/4) - No legend needed for this chart type; subplot titles serve as labels
• SC-06: Title format (3/3) - Correct format "bullet-basic · plotly · pyplots.ai"

Visual Quality (33/35 pts)

• VQ-01: Meaningful axis labels (5/7) - Metric labels clear; x-axis has no explicit label but tick values are self-explanatory for bullet charts
• VQ-02: No overlapping text (6/6) - All text readable, no overlaps
• VQ-03: Color choice (5/5) - Grayscale bands per spec, Python blue for measure bar, black target marker
• VQ-04: Clear data elements (5/5) - Bars and markers clearly visible, appropriate sizes
• VQ-05: Layout balance (5/5) - Good proportions, clean spacing, no cut-off content
• VQ-06: Grid subtlety (3/3) - Subtle grid with low opacity (0.1 alpha)
• VQ-07: Legend placement (2/2) - No legend needed; N/A
• VQ-08: Image size (2/2) - 4800x2700 px (1600x900 with scale=3)

Data Quality (14/15 pts)

• DQ-01: Feature coverage (5/6) - Shows multiple metrics with different performance levels (above/below target), demonstrates variability. Minor: could show more extreme variations
• DQ-02: Realistic context (5/5) - Business KPI dashboard scenario is realistic and plausible
• DQ-03: Appropriate scale (4/4) - Values sensible: revenue in $K, satisfaction 1-5 scale, customer counts

Code Quality (13/15 pts)

• CQ-01: KISS structure (4/4) - Sequential structure: imports → data → plot → save
• CQ-02: Reproducible (3/3) - Deterministic data (no random)
• CQ-03: Library idioms (2/3) - Uses graph_objects and subplots appropriately; minor: annotation loop modifies layout dict directly
• CQ-04: Clean imports (2/2) - Only necessary imports (go, make_subplots)
• CQ-05: Helpful comments (1/1) - Clear section comments
• CQ-06: No deprecated API (1/1) - Uses current Plotly API
• CQ-07: Output correct (0/1) - Outputs both plot.png and plot.html (plot.html is correct per interactive library rules)

Issues Found

1. Minor - Axis labels: The x-axes lack explicit unit labels, though the subplot titles include units (e.g., "$K"). This is acceptable for bullet charts but could be slightly improved.

2. Minor - Annotation loop: The code modifies fig["layout"]["annotations"] directly to update font sizes, which works but is less idiomatic than using update_annotations().

AI Feedback

This is a well-executed bullet chart implementation that follows the specification closely. The use of subplots to give each metric its own scale is a good approach. The grayscale qualitative bands, blue measure bars, and black target markers create clear visual hierarchy as recommended in the spec.

Suggestions for future reference:

• Could use fig.update_annotations(font=dict(size=22)) with a selector instead of the loop
• The data demonstrates good variety (above target, below target scenarios) which is excellent for feature coverage

Verdict: APPROVED