feat(plotly): implement line-markers

[github-actions]

Implementation: line-markers - plotly

Implements the plotly version of line-markers.

File: plots/line-markers/implementations/plotly.py

---

🤖 impl-generate workflow

[claude]

AI Review - Attempt 1/3

Image Description

The plot displays three temperature sensor time series (Sensor A, B, C) over 15 hours on a white background. Sensor A (blue circles) shows the highest readings peaking around 23.5°C at hour 7 before declining. Sensor B (yellow squares) fluctuates in the middle range around 17-20°C. Sensor C (orange/red diamonds) trends downward from ~18.5°C to ~15°C. The title "line-markers · plotly · pyplots.ai" is centered at the top. X-axis shows "Time (hours)" from 0-14 with tick marks every 2 hours. Y-axis shows "Temperature (°C)" from 15-24. Legend is positioned in the upper left with a semi-transparent white background. Grid lines are subtle. Each series has thick lines (~4px width) with large, clearly visible markers (~16px) in distinct shapes.

Quality Score: 94/100

Criteria Checklist

Visual Quality (38/40 pts)

• VQ-01: Text Legibility (10/10) - Title, axis labels, and tick marks are all clearly readable at the output resolution
• VQ-02: No Overlap (8/8) - No overlapping text or elements
• VQ-03: Element Visibility (8/8) - Markers are large and clearly visible, line width is appropriate for the data density
• VQ-04: Color Accessibility (5/5) - Blue, yellow, and red/orange provide excellent contrast and are colorblind-safe
• VQ-05: Layout Balance (5/5) - Plot fills canvas well with balanced margins
• VQ-06: Axis Labels (2/2) - Descriptive labels with units: "Temperature (°C)" and "Time (hours)"
• VQ-07: Grid & Legend (0/2) - Grid is appropriate, but legend placement could be better (upper-left is acceptable but overlaps slightly with the plot area)

Spec Compliance (25/25 pts)

• SC-01: Plot Type (8/8) - Correct line plot with markers
• SC-02: Data Mapping (5/5) - X (time) and Y (temperature) correctly mapped
• SC-03: Required Features (5/5) - Multiple series with different marker shapes, markers clearly visible against lines
• SC-04: Data Range (3/3) - All data points visible within axis range
• SC-05: Legend Accuracy (2/2) - Legend labels correctly identify all three series
• SC-06: Title Format (2/2) - Uses correct format: "line-markers · plotly · pyplots.ai"

Data Quality (18/20 pts)

• DQ-01: Feature Coverage (8/8) - Shows multiple series with different trends (rising, stable, declining), demonstrates sparse data visualization
• DQ-02: Realistic Context (5/7) - Temperature sensor readings is a plausible scenario, but the random walk pattern could be more realistic for actual sensor data
• DQ-03: Appropriate Scale (5/5) - Temperature values (15-24°C) are realistic indoor/environmental temperatures

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) - np.random.seed(42) is set
• CQ-03: Clean Imports (2/2) - Only numpy and plotly.graph_objects imported, both used
• CQ-04: No Deprecated API (1/1) - Uses current Plotly 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 graph_objects for fine control, marker customization with border lines, interactive HTML export. Could have used hover templates or animations for more distinctive Plotly features.

Strengths

• Excellent marker visibility with distinct shapes (circle, square, diamond) for each series
• White border lines on markers provide excellent contrast against the lines
• Clean, professional layout with appropriate font sizes for high-resolution output
• Good use of Plotly's graph_objects for fine-grained control over styling
• Outputs both PNG and interactive HTML, showcasing Plotly's dual capability
• Realistic temperature sensor scenario that fits the sparse data use case well

Weaknesses

• Legend could be positioned outside the plot area (e.g., to the right) to avoid any potential overlap with data
• Hover templates or other interactive features could better showcase Plotly's distinctive capabilities

Verdict: APPROVED