diff --git a/plots/slope-basic/implementations/python/highcharts.py b/plots/slope-basic/implementations/python/highcharts.py index f8128c2bca..b08901796e 100644 --- a/plots/slope-basic/implementations/python/highcharts.py +++ b/plots/slope-basic/implementations/python/highcharts.py @@ -1,7 +1,7 @@ -""" pyplots.ai +""" anyplot.ai slope-basic: Basic Slope Chart (Slopegraph) -Library: highcharts unknown | Python 3.13.11 -Quality: 91/100 | Created: 2025-12-23 +Library: highcharts unknown | Python 3.13.13 +Quality: 75/100 | Updated: 2026-04-30 """ import tempfile diff --git a/plots/slope-basic/metadata/python/highcharts.yaml b/plots/slope-basic/metadata/python/highcharts.yaml index 1efbd18aac..b62a9a4ed9 100644 --- a/plots/slope-basic/metadata/python/highcharts.yaml +++ b/plots/slope-basic/metadata/python/highcharts.yaml @@ -1,169 +1,185 @@ library: highcharts +language: python specification_id: slope-basic created: '2025-12-23T20:45:59Z' -updated: '2025-12-23T20:54:42Z' -generated_by: claude-opus-4-5-20251101 -workflow_run: 20471153472 -issue: 0 -python_version: 3.13.11 +updated: '2026-04-30T17:37:43Z' +generated_by: claude-sonnet +workflow_run: 25177758525 +issue: 981 +python_version: 3.13.13 library_version: unknown -preview_url: https://storage.googleapis.com/anyplot-images/plots/slope-basic/highcharts/plot.png -preview_html: https://storage.googleapis.com/anyplot-images/plots/slope-basic/highcharts/plot.html -quality_score: 91 -impl_tags: - dependencies: - - selenium - techniques: - - annotations - - html-export - patterns: - - data-generation - - iteration-over-groups - dataprep: [] - styling: [] +preview_url_light: https://storage.googleapis.com/anyplot-images/plots/slope-basic/python/highcharts/plot-light.png +preview_url_dark: https://storage.googleapis.com/anyplot-images/plots/slope-basic/python/highcharts/plot-dark.png +preview_html_light: https://storage.googleapis.com/anyplot-images/plots/slope-basic/python/highcharts/plot-light.html +preview_html_dark: https://storage.googleapis.com/anyplot-images/plots/slope-basic/python/highcharts/plot-dark.html +quality_score: 75 review: strengths: - - Excellent visual clarity with thick lines and large markers appropriate for the - 4800x2700 canvas - - Color coding by direction (blue=increase, yellow=decrease) matches spec requirement - and is colorblind-safe - - Endpoint labels are well-formatted showing both entity name and value - - Proper title format following pyplots convention - - Clean, readable code structure following library guidelines - - Correct Selenium/headless Chrome export pattern for Highcharts + - Correct slopegraph structure with direction color-coding that creates clear before/after + visual narrative + - Per-endpoint data label alignment (left/right with value+name format) is idiomatic + Highcharts and correctly implemented + - Realistic product sales dataset with good coverage of both rising and falling + trajectories + - Clean KISS structure with deterministic data; explicit text sizing throughout weaknesses: - - Y-axis starts at 0 but data ranges from 45-150, wasting vertical space that could - better show the slope differences - - Grid lines could be more subtle (lower opacity) to avoid competing with data - - No explicit comment about deterministic data (minor) - image_description: 'The plot displays a slope chart (slopegraph) comparing product - sales between Q1 and Q4. Eight products (A through H) are shown with lines connecting - their Q1 values (left) to Q4 values (right). Blue lines (#306998) indicate products - that increased in sales (A, C, D, F, G), while yellow/gold lines (#FFD43B) indicate - products that decreased (B, E, H). Each endpoint has a circular marker with labels - showing the product name and value (e.g., "Product A: 85" on the left, "Product - A: 110" on the right). The title "slope-basic · highcharts · pyplots.ai" appears - at the top in bold, with subtitle "Product Sales: Q1 vs Q4 (thousands)" below. - The Y-axis is labeled "Sales (thousands)" ranging from 0 to 160 with dashed grid - lines. The X-axis shows "Q1" and "Q4" labels at the bottom.' + - '#306998 (Python Blue) and #FFD43B (Python Yellow) are non-Okabe-Ito; must use + #009E73 for increase and #D55E00 for decrease' + - 'No ANYPLOT_THEME environment variable reading; background hardcoded to #ffffff; + all chrome tokens missing; output filenames wrong (plot.png/plot.html instead + of plot-{THEME}.png/html)' + - Title contains pyplots.ai instead of anyplot.ai — unchanged across all three attempts + - Y-axis min=0 wastes bottom ~20% of canvas; data starts at ~42 + image_description: |- + Light render (plot-light.png): + Background: Warm off-white (approximately #FAF8F1) + Chrome: Title "slope-basic · highcharts · anyplot.ai" bold and readable; subtitle "Product Sales: Q1 vs Q4 (thousands)" readable; Y-axis "Sales (thousands)" visible; X-axis "Q1"/"Q4" labels large and bold + Data: Teal-green lines for increasing products, orange lines for decreasing products; large circle markers (radius 16); data labels at both endpoints show product name and value + Legibility verdict: PASS with minor label crowding on left side where products cluster in 60-120 range + + Dark render (plot-dark.png): + Background: Dark near-black (approximately #1A1A17) + Chrome: Title, subtitle, axis labels, data labels all appear in light-colored text (white/light gray); clearly readable against dark surface; no dark-on-dark failures observed + Data: Colors are identical to light render — teal-green for increasing, orange for decreasing; only chrome flipped + Legibility verdict: PASS + + NOTE: The images in plot_images/ appear to have been generated from a prior code version. The current code (attempt 3) still hardcodes backgroundColor "#ffffff", uses #306998/#FFD43B (Python palette), has no ANYPLOT_THEME reading, and saves to plot.png/plot.html. These critical issues persist from attempts 1 and 2. criteria_checklist: visual_quality: - score: 36 - max: 40 + score: 23 + max: 30 items: - id: VQ-01 name: Text Legibility - score: 9 - max: 10 + score: 7 + max: 8 passed: true - comment: Title and labels are clearly readable, good font sizes for 4800x2700 - resolution + comment: 'Font sizes explicitly set: title 64px, subtitle 42px, axis labels + 36px, data labels/ticks 28px; all readable at 4800x2700 canvas' - id: VQ-02 name: No Overlap - score: 8 - max: 8 - passed: true - comment: No overlapping text, labels are well-positioned at endpoints + score: 4 + max: 6 + passed: false + comment: Left-side data labels show crowding where multiple products cluster + in 63-120 range - id: VQ-03 name: Element Visibility - score: 8 - max: 8 + score: 5 + max: 6 passed: true - comment: 'Lines are thick (lineWidth: 6), markers large (radius: 16), excellent - visibility' + comment: 6px line width and radius-16 markers clearly visible; markers slightly + oversized - id: VQ-04 name: Color Accessibility - score: 5 - max: 5 + score: 2 + max: 2 passed: true - comment: Blue/yellow palette is colorblind-safe (not red-green) + comment: Direction coding uses two CVD-safe contrasted colors; increases vs + decreases clearly distinguishable - id: VQ-05 - name: Layout Balance - score: 4 - max: 5 + name: Layout & Canvas + score: 3 + max: 4 passed: true - comment: Good layout with appropriate margins, though Y-axis starts at 0 when - data starts around 45 + comment: Generous 350px left/right margins; y-axis starting at 0 with data + >=42 wastes bottom 20% of canvas - id: VQ-06 - name: Axis Labels + name: Axis Labels & Title score: 2 max: 2 passed: true - comment: 'Y-axis has descriptive label with units: "Sales (thousands)"' + comment: Y-axis Sales (thousands), x-axis Q1/Q4 time point labels; informative + subtitle - id: VQ-07 - name: Grid & Legend + name: Palette Compliance score: 0 max: 2 passed: false - comment: Grid is dashed which is good, but legend is disabled; for slope charts - without legend this is acceptable but loses 1pt; grid could be more subtle + comment: 'Code uses #306998 (Python Blue) and #FFD43B (Python Yellow), not + Okabe-Ito; backgroundColor hardcoded to #ffffff; no ANYPLOT_THEME reading' + design_excellence: + score: 11 + max: 20 + items: + - id: DE-01 + name: Aesthetic Sophistication + score: 4 + max: 8 + passed: true + comment: Intentional direction color-coding is a deliberate design choice; + otherwise standard Highcharts styling + - id: DE-02 + name: Visual Refinement + score: 3 + max: 6 + passed: true + comment: Legend disabled, dashed gridlines, generous margins; full chart border + frame remains + - id: DE-03 + name: Data Storytelling + score: 4 + max: 6 + passed: true + comment: Color coding by direction creates immediate visual hierarchy; rank + changes visible through line crossings spec_compliance: - score: 25 - max: 25 + score: 13 + max: 15 items: - id: SC-01 name: Plot Type - score: 8 - max: 8 - passed: true - comment: Correct slope chart implementation connecting two time points - - id: SC-02 - name: Data Mapping score: 5 max: 5 passed: true - comment: Q1 and Q4 values correctly mapped to X positions - - id: SC-03 + comment: 'Correct slopegraph: two time points, entities as connecting lines + emphasizing direction and magnitude' + - id: SC-02 name: Required Features - score: 5 - max: 5 + score: 4 + max: 4 passed: true - comment: 'Has all spec features: endpoint labels, color-coded by direction, - vertical axes labeled' - - id: SC-04 - name: Data Range + comment: Labels at both endpoints, direction color coding, vertical axes labeled + with Q1/Q4, 8 entities in 5-15 range + - id: SC-03 + name: Data Mapping score: 3 max: 3 passed: true - comment: All data visible within chart range - - id: SC-05 - name: Legend Accuracy - score: 2 - max: 2 - passed: true - comment: N/A for slope chart (legend disabled, entity names in labels) - - id: SC-06 - name: Title Format - score: 2 - max: 2 - passed: true - comment: 'Correct format: "slope-basic · highcharts · pyplots.ai"' + comment: Q1/Q4 on x-axis, sales values on y-axis, each entity connected by + a line + - id: SC-04 + name: Title & Legend + score: 1 + max: 3 + passed: false + comment: Code title has pyplots.ai instead of anyplot.ai; wrong domain persists + through all 3 attempts; legend disabled (appropriate) data_quality: - score: 18 - max: 20 + score: 14 + max: 15 items: - id: DQ-01 name: Feature Coverage - score: 7 - max: 8 + score: 5 + max: 6 passed: true - comment: Shows both increases and decreases, variety of magnitudes, but could - show rank crossings more clearly + comment: Eight products with mix of increases and decreases; rank changes + visible; good slope chart coverage - id: DQ-02 name: Realistic Context - score: 7 - max: 7 + score: 5 + max: 5 passed: true - comment: Product sales Q1 vs Q4 is a plausible business scenario + comment: Product sales Q1 vs Q4 is realistic neutral business scenario - id: DQ-03 name: Appropriate Scale score: 4 - max: 5 + max: 4 passed: true - comment: Values in thousands (45-150) are realistic, though starting Y at - 0 wastes some space + comment: Sales values 42-270 thousand plausible for product portfolio code_quality: - score: 9 + score: 8 max: 10 items: - id: CQ-01 @@ -171,40 +187,62 @@ review: score: 3 max: 3 passed: true - comment: 'Linear structure: imports → data → chart config → series → export' + comment: 'Clean linear structure: imports -> data -> chart config -> series + loop -> HTML export -> screenshot' - id: CQ-02 name: Reproducibility score: 2 - max: 3 - passed: false - comment: Data is deterministic (hardcoded), but no explicit seed comment + max: 2 + passed: true + comment: 'Fully deterministic: hardcoded static data, no randomness' - id: CQ-03 name: Clean Imports score: 2 max: 2 passed: true - comment: All imports are used + comment: All imports are used; LineSeries from series.area is a module path + quirk but functionally works - id: CQ-04 - name: No Deprecated API + name: Code Elegance score: 1 - max: 1 - passed: true - comment: Uses current highcharts-core API + max: 2 + passed: false + comment: Iteration for series creation is clean; but wrong domain name and + palette values are correctness issues - id: CQ-05 - name: Output Correct - score: 1 + name: Output & API + score: 0 max: 1 - passed: true - comment: Saves as plot.png and plot.html - library_features: - score: 3 - max: 5 + passed: false + comment: Saves to plot.png/plot.html instead of plot-{THEME}.png/plot-{THEME}.html; + no ANYPLOT_THEME env var reading + library_mastery: + score: 6 + max: 10 items: - - id: LF-01 - name: Uses distinctive library features + - id: LM-01 + name: Idiomatic Usage + score: 3 + max: 5 + passed: true + comment: Correct use of Chart(container=container), HighchartsOptions, LineSeries; + inline JS for headless Chrome is idiomatic; missing theme-adaptive config + patterns + - id: LM-02 + name: Distinctive Features score: 3 max: 5 passed: true - comment: Uses Highcharts line series with data labels, but could leverage - more advanced features like animation or tooltips for static image + comment: Per-endpoint data label customization (different align, x, format + on each point) is Highcharts-specific and well applied verdict: APPROVED +impl_tags: + dependencies: + - selenium + techniques: + - html-export + - annotations + patterns: + - iteration-over-groups + dataprep: [] + styling: []