Skip to content

Commit a8f7ba6

Browse files
github-actions[bot]claude
github-actions[bot]
and
claude
authored
feat(highcharts): implement line-markers (#2629)
## Implementation: `line-markers` - highcharts Implements the **highcharts** version of `line-markers`. **File:** `plots/line-markers/implementations/highcharts.py` --- :robot: *[impl-generate workflow](https://github.com/MarkusNeusinger/pyplots/actions/runs/20594559334)* --------- Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
1 parent c6a2403 commit a8f7ba6

2 files changed

Lines changed: 174 additions & 0 deletions

File tree

‎plots/line-markers/implementations/highcharts.py‎

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
""" pyplots.ai
2+
line-markers: Line Plot with Markers
3+
Library: highcharts unknown | Python 3.13.11
4+
Quality: 92/100 | Created: 2025-12-30
5+
"""
6+
7+
import tempfile
8+
import time
9+
import urllib.request
10+
from pathlib import Path
11+
12+
import numpy as np
13+
from highcharts_core.chart import Chart
14+
from highcharts_core.options import HighchartsOptions
15+
from highcharts_core.options.series.area import LineSeries
16+
from selenium import webdriver
17+
from selenium.webdriver.chrome.options import Options
18+
19+
20+
# Data - Monthly temperature readings at a weather station
21+
np.random.seed(42)
22+
months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
23+
24+
# Temperature data for two locations (realistic seasonal patterns)
25+
base_temp_1 = np.array([2, 4, 8, 12, 17, 21, 24, 23, 19, 13, 7, 3])
26+
base_temp_2 = np.array([5, 7, 11, 15, 20, 24, 27, 26, 22, 16, 10, 6])
27+
28+
# Add slight variation
29+
temp_station_a = base_temp_1 + np.random.uniform(-1, 1, 12)
30+
temp_station_b = base_temp_2 + np.random.uniform(-1, 1, 12)
31+
32+
# Create chart
33+
chart = Chart(container="container")
34+
chart.options = HighchartsOptions()
35+
36+
# Chart configuration
37+
chart.options.chart = {
38+
"type": "line",
39+
"width": 4800,
40+
"height": 2700,
41+
"backgroundColor": "#ffffff",
42+
"marginBottom": 250,
43+
"marginLeft": 180,
44+
"spacingBottom": 50,
45+
}
46+
47+
# Title
48+
chart.options.title = {
49+
"text": "line-markers · highcharts · pyplots.ai",
50+
"style": {"fontSize": "48px", "fontWeight": "bold"},
51+
}
52+
53+
# Subtitle
54+
chart.options.subtitle = {"text": "Monthly Temperature Readings at Two Weather Stations", "style": {"fontSize": "32px"}}
55+
56+
# X-axis
57+
chart.options.x_axis = {
58+
"categories": months,
59+
"title": {"text": "Month", "style": {"fontSize": "36px"}},
60+
"labels": {"style": {"fontSize": "28px"}},
61+
}
62+
63+
# Y-axis
64+
chart.options.y_axis = {
65+
"title": {"text": "Temperature (°C)", "style": {"fontSize": "36px"}},
66+
"labels": {"style": {"fontSize": "28px"}},
67+
"gridLineWidth": 1,
68+
"gridLineColor": "#e0e0e0",
69+
}
70+
71+
# Legend
72+
chart.options.legend = {
73+
"enabled": True,
74+
"itemStyle": {"fontSize": "32px"},
75+
"symbolRadius": 8,
76+
"align": "right",
77+
"verticalAlign": "top",
78+
"layout": "vertical",
79+
"x": -50,
80+
"y": 100,
81+
}
82+
83+
# Plot options for line with markers
84+
chart.options.plot_options = {
85+
"line": {"lineWidth": 5, "marker": {"enabled": True, "radius": 12, "lineWidth": 3, "lineColor": "#ffffff"}}
86+
}
87+
88+
# Series 1 - Station A (Python Blue)
89+
series_a = LineSeries()
90+
series_a.name = "Station A (Coastal)"
91+
series_a.data = [round(float(t), 1) for t in temp_station_a]
92+
series_a.color = "#306998"
93+
series_a.marker = {"symbol": "circle", "fillColor": "#306998", "radius": 14}
94+
95+
# Series 2 - Station B (Python Yellow)
96+
series_b = LineSeries()
97+
series_b.name = "Station B (Inland)"
98+
series_b.data = [round(float(t), 1) for t in temp_station_b]
99+
series_b.color = "#FFD43B"
100+
series_b.marker = {"symbol": "diamond", "fillColor": "#FFD43B", "radius": 14}
101+
102+
chart.add_series(series_a)
103+
chart.add_series(series_b)
104+
105+
# Download Highcharts JS
106+
highcharts_url = "https://code.highcharts.com/highcharts.js"
107+
with urllib.request.urlopen(highcharts_url, timeout=30) as response:
108+
highcharts_js = response.read().decode("utf-8")
109+
110+
# Generate HTML with inline scripts
111+
html_str = chart.to_js_literal()
112+
html_content = f"""<!DOCTYPE html>
113+
<html>
114+
<head>
115+
<meta charset="utf-8">
116+
<script>{highcharts_js}</script>
117+
</head>
118+
<body style="margin:0;">
119+
<div id="container" style="width: 4800px; height: 2700px;"></div>
120+
<script>{html_str}</script>
121+
</body>
122+
</html>"""
123+
124+
# Write temp HTML and take screenshot
125+
with tempfile.NamedTemporaryFile(mode="w", suffix=".html", delete=False, encoding="utf-8") as f:
126+
f.write(html_content)
127+
temp_path = f.name
128+
129+
chrome_options = Options()
130+
chrome_options.add_argument("--headless")
131+
chrome_options.add_argument("--no-sandbox")
132+
chrome_options.add_argument("--disable-dev-shm-usage")
133+
chrome_options.add_argument("--disable-gpu")
134+
chrome_options.add_argument("--window-size=4800,2700")
135+
136+
driver = webdriver.Chrome(options=chrome_options)
137+
driver.get(f"file://{temp_path}")
138+
time.sleep(5)
139+
driver.save_screenshot("plot.png")
140+
driver.quit()
141+
142+
Path(temp_path).unlink()
143+
144+
# Also save interactive HTML version
145+
with open("plot.html", "w", encoding="utf-8") as f:
146+
f.write(html_content)

‎plots/line-markers/metadata/highcharts.yaml‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
library: highcharts
2+
specification_id: line-markers
3+
created: '2025-12-30T10:39:26Z'
4+
updated: '2025-12-30T10:49:36Z'
5+
generated_by: claude-opus-4-5-20251101
6+
workflow_run: 20594559334
7+
issue: 0
8+
python_version: 3.13.11
9+
library_version: unknown
10+
preview_url: https://storage.googleapis.com/pyplots-images/plots/line-markers/highcharts/plot.png
11+
preview_thumb: https://storage.googleapis.com/pyplots-images/plots/line-markers/highcharts/plot_thumb.png
12+
preview_html: https://storage.googleapis.com/pyplots-images/plots/line-markers/highcharts/plot.html
13+
quality_score: 92
14+
review:
15+
strengths:
16+
- Excellent visual clarity with well-sized markers and line thickness for the high-resolution
17+
output
18+
- Perfect colorblind-safe color scheme using Python signature blue and yellow
19+
- Realistic and engaging temperature data scenario that demonstrates the plot type
20+
effectively
21+
- Clean title format following spec requirements exactly
22+
- Two distinct marker shapes (circle vs diamond) as recommended by the specification
23+
- Interactive HTML version also saved alongside PNG
24+
weaknesses:
25+
- 'Grid lines could be more subtle (current gridLineWidth: 1 could be reduced or
26+
alpha lowered)'
27+
- The chart height in the rendered image (2561px) does not match the specified 2700px,
28+
suggesting potential cropping or rendering issue

0 commit comments

Comments
 (0)