Skip to content

Commit 87f3195

Browse files
github-actions[bot]github-actions[bot]
authored
feat(highcharts): implement venn-basic (#2485)
## Implementation: `venn-basic` - highcharts Implements the **highcharts** version of `venn-basic`. **File:** `plots/venn-basic/implementations/highcharts.py` --- :robot: *[impl-generate workflow](https://github.com/MarkusNeusinger/pyplots/actions/runs/20584334156)* --------- Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com> Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
1 parent f3ffd8e commit 87f3195

2 files changed

Lines changed: 156 additions & 0 deletions

File tree

‎plots/venn-basic/implementations/highcharts.py‎

Lines changed: 130 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,130 @@
1+
""" pyplots.ai
2+
venn-basic: Venn Diagram
3+
Library: highcharts unknown | Python 3.13.11
4+
Quality: 91/100 | Created: 2025-12-29
5+
"""
6+
7+
import tempfile
8+
import time
9+
import urllib.request
10+
from pathlib import Path
11+
12+
from highcharts_core.chart import Chart
13+
from highcharts_core.options import HighchartsOptions
14+
from highcharts_core.options.series.venn import VennSeries
15+
from selenium import webdriver
16+
from selenium.webdriver.chrome.options import Options
17+
18+
19+
# Download Highcharts JS and Venn module (required for headless Chrome)
20+
highcharts_url = "https://code.highcharts.com/highcharts.js"
21+
with urllib.request.urlopen(highcharts_url, timeout=30) as response:
22+
highcharts_js = response.read().decode("utf-8")
23+
24+
venn_url = "https://code.highcharts.com/modules/venn.js"
25+
with urllib.request.urlopen(venn_url, timeout=30) as response:
26+
venn_js = response.read().decode("utf-8")
27+
28+
# Data: Three programming skill sets with realistic overlaps
29+
# Set A: Backend developers (100), Set B: Frontend developers (80), Set C: DevOps engineers (60)
30+
venn_data = [
31+
{"sets": ["Backend"], "value": 100},
32+
{"sets": ["Frontend"], "value": 80},
33+
{"sets": ["DevOps"], "value": 60},
34+
{"sets": ["Backend", "Frontend"], "value": 30},
35+
{"sets": ["Backend", "DevOps"], "value": 20},
36+
{"sets": ["Frontend", "DevOps"], "value": 15},
37+
{"sets": ["Backend", "Frontend", "DevOps"], "value": 10},
38+
]
39+
40+
# Create chart
41+
chart = Chart(container="container")
42+
chart.options = HighchartsOptions()
43+
44+
# Chart settings
45+
chart.options.chart = {"type": "venn", "width": 4800, "height": 2700, "backgroundColor": "#ffffff"}
46+
47+
# Title
48+
chart.options.title = {
49+
"text": "venn-basic \u00b7 highcharts \u00b7 pyplots.ai",
50+
"style": {"fontSize": "48px", "fontWeight": "bold"},
51+
}
52+
53+
# Subtitle
54+
chart.options.subtitle = {"text": "Developer Skill Distribution (Team of 150)", "style": {"fontSize": "32px"}}
55+
56+
# Create Venn series
57+
series = VennSeries()
58+
series.data = venn_data
59+
series.name = "Team Skills"
60+
61+
# Series styling
62+
series.data_labels = {
63+
"enabled": True,
64+
"style": {"fontSize": "28px", "fontWeight": "normal", "textOutline": "none"},
65+
"format": "{point.name}: {point.value}",
66+
}
67+
68+
# Colors: Python Blue, Python Yellow, and a complementary purple
69+
chart.options.colors = ["#306998", "#FFD43B", "#9467BD"]
70+
71+
chart.add_series(series)
72+
73+
# Legend
74+
chart.options.legend = {"enabled": True, "itemStyle": {"fontSize": "24px"}}
75+
76+
# Accessibility
77+
chart.options.accessibility = {"enabled": False}
78+
79+
# Generate HTML with inline scripts
80+
html_str = chart.to_js_literal()
81+
html_content = f"""<!DOCTYPE html>
82+
<html>
83+
<head>
84+
<meta charset="utf-8">
85+
<script>{highcharts_js}</script>
86+
<script>{venn_js}</script>
87+
</head>
88+
<body style="margin:0;">
89+
<div id="container" style="width: 4800px; height: 2700px;"></div>
90+
<script>{html_str}</script>
91+
</body>
92+
</html>"""
93+
94+
# Write temp HTML and take screenshot
95+
with tempfile.NamedTemporaryFile(mode="w", suffix=".html", delete=False, encoding="utf-8") as f:
96+
f.write(html_content)
97+
temp_path = f.name
98+
99+
chrome_options = Options()
100+
chrome_options.add_argument("--headless")
101+
chrome_options.add_argument("--no-sandbox")
102+
chrome_options.add_argument("--disable-dev-shm-usage")
103+
chrome_options.add_argument("--disable-gpu")
104+
chrome_options.add_argument("--window-size=4800,2700")
105+
106+
driver = webdriver.Chrome(options=chrome_options)
107+
driver.get(f"file://{temp_path}")
108+
time.sleep(5)
109+
driver.save_screenshot("plot.png")
110+
driver.quit()
111+
112+
Path(temp_path).unlink()
113+
114+
# Also save HTML for interactive version
115+
with open("plot.html", "w", encoding="utf-8") as f:
116+
# Use CDN for the HTML file (works in browsers)
117+
interactive_html = f"""<!DOCTYPE html>
118+
<html>
119+
<head>
120+
<meta charset="utf-8">
121+
<title>venn-basic - highcharts - pyplots.ai</title>
122+
<script src="https://code.highcharts.com/highcharts.js"></script>
123+
<script src="https://code.highcharts.com/modules/venn.js"></script>
124+
</head>
125+
<body style="margin:0;">
126+
<div id="container" style="width: 100%; height: 100vh;"></div>
127+
<script>{html_str}</script>
128+
</body>
129+
</html>"""
130+
f.write(interactive_html)

‎plots/venn-basic/metadata/highcharts.yaml‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
library: highcharts
2+
specification_id: venn-basic
3+
created: '2025-12-29T22:52:46Z'
4+
updated: '2025-12-29T23:00:30Z'
5+
generated_by: claude-opus-4-5-20251101
6+
workflow_run: 20584334156
7+
issue: 0
8+
python_version: 3.13.11
9+
library_version: unknown
10+
preview_url: https://storage.googleapis.com/pyplots-images/plots/venn-basic/highcharts/plot.png
11+
preview_thumb: https://storage.googleapis.com/pyplots-images/plots/venn-basic/highcharts/plot_thumb.png
12+
preview_html: https://storage.googleapis.com/pyplots-images/plots/venn-basic/highcharts/plot.html
13+
quality_score: 91
14+
review:
15+
strengths:
16+
- Excellent use of Highcharts VennSeries with proper data structure for sets and
17+
intersections
18+
- Colorblind-safe palette (Python blue, yellow, purple) with good transparency in
19+
overlaps
20+
- Realistic, relatable data scenario (developer skill distribution)
21+
- Clean data labels showing both set names and values in each region
22+
- Both PNG and interactive HTML outputs generated
23+
- Good canvas utilization with the diagram filling most of the space
24+
weaknesses:
25+
- Legend does not explicitly map colors to set names (Highcharts Venn limitation)
26+
- Very slight bottom edge clipping visible in the image

0 commit comments

Comments
 (0)