Skip to content

Commit b7470b9

Browse files
github-actions[bot]claude[bot]MarkusNeusinger
authored
feat: add scatter-color-groups implementation (9 libraries) (#488)
## Summary Adds `scatter-color-groups` plot implementation. ### Libraries - **Merged:** 9 - **Not Feasible:** 0 ### Links - **Spec:** `specs/scatter-color-groups.md` - **Parent Issue:** #208 (closes on merge) --- :robot: *Auto-generated by pyplots CI* --------- Co-authored-by: claude[bot] <209825114+claude[bot]@users.noreply.github.com> Co-authored-by: claude[bot] <41898282+claude[bot]@users.noreply.github.com> Co-authored-by: Markus Neusinger <2921697+MarkusNeusinger@users.noreply.github.com>
1 parent 8cb29fe commit b7470b9

File tree

9 files changed

+612
-238
lines changed

9 files changed

+612
-238
lines changed

‎plots/altair/point/scatter-color-groups/default.py‎

Lines changed: 54 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
"""
2+
scatter-color-groups: Scatter Plot with Color Groups
3+
Library: altair
4+
"""
5+
6+
import altair as alt
7+
import numpy as np
8+
import pandas as pd
9+
10+
11+
# Data - create iris-like dataset with three species groups
12+
np.random.seed(42)
13+
14+
# Generate data for three groups with different cluster centers
15+
n_per_group = 50
16+
17+
# Setosa: smaller sepal length, larger sepal width
18+
setosa_x = np.random.normal(5.0, 0.4, n_per_group)
19+
setosa_y = np.random.normal(3.4, 0.4, n_per_group)
20+
21+
# Versicolor: medium values
22+
versicolor_x = np.random.normal(6.0, 0.5, n_per_group)
23+
versicolor_y = np.random.normal(2.8, 0.3, n_per_group)
24+
25+
# Virginica: larger sepal length, medium sepal width
26+
virginica_x = np.random.normal(6.6, 0.6, n_per_group)
27+
virginica_y = np.random.normal(3.0, 0.35, n_per_group)
28+
29+
data = pd.DataFrame(
30+
{
31+
"sepal_length": np.concatenate([setosa_x, versicolor_x, virginica_x]),
32+
"sepal_width": np.concatenate([setosa_y, versicolor_y, virginica_y]),
33+
"species": ["setosa"] * n_per_group + ["versicolor"] * n_per_group + ["virginica"] * n_per_group,
34+
}
35+
)
36+
37+
# Define custom color palette (colorblind-safe)
38+
color_scale = alt.Scale(domain=["setosa", "versicolor", "virginica"], range=["#306998", "#FFD43B", "#059669"])
39+
40+
# Create scatter plot with color groups
41+
chart = (
42+
alt.Chart(data)
43+
.mark_point(size=100, opacity=0.7)
44+
.encode(
45+
x=alt.X("sepal_length:Q", title="Sepal Length (cm)"),
46+
y=alt.Y("sepal_width:Q", title="Sepal Width (cm)"),
47+
color=alt.Color("species:N", title="Species", scale=color_scale),
48+
tooltip=["species:N", "sepal_length:Q", "sepal_width:Q"],
49+
)
50+
.properties(width=1600, height=900, title="Scatter Plot with Color Groups")
51+
)
52+
53+
# Save as PNG (1600 × 900 × 3 = 4800 × 2700 px)
54+
chart.save("plot.png", scale_factor=3.0)

‎plots/bokeh/scatter/scatter-color-groups/default.py‎

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
"""
2+
scatter-color-groups: Scatter Plot with Color Groups
3+
Library: bokeh
4+
"""
5+
6+
import numpy as np
7+
import pandas as pd
8+
from bokeh.io import export_png
9+
from bokeh.models import ColumnDataSource
10+
from bokeh.plotting import figure
11+
12+
13+
# Data - Iris-like dataset
14+
np.random.seed(42)
15+
n_per_group = 50
16+
17+
data = pd.DataFrame({
18+
"sepal_length": np.concatenate([
19+
np.random.normal(5.0, 0.35, n_per_group),
20+
np.random.normal(5.9, 0.50, n_per_group),
21+
np.random.normal(6.6, 0.60, n_per_group),
22+
]),
23+
"sepal_width": np.concatenate([
24+
np.random.normal(3.4, 0.38, n_per_group),
25+
np.random.normal(2.8, 0.30, n_per_group),
26+
np.random.normal(3.0, 0.30, n_per_group),
27+
]),
28+
"species": ["setosa"] * n_per_group + ["versicolor"] * n_per_group + ["virginica"] * n_per_group,
29+
})
30+
31+
# Color palette (from style guide)
32+
colors = ["#306998", "#FFD43B", "#DC2626", "#059669", "#8B5CF6", "#F97316"]
33+
species_list = data["species"].unique().tolist()
34+
color_map = {species: colors[i] for i, species in enumerate(species_list)}
35+
data["color"] = data["species"].map(color_map)
36+
37+
# Create figure
38+
p = figure(
39+
width=4800,
40+
height=2700,
41+
title="Scatter Plot with Color Groups",
42+
x_axis_label="Sepal Length (cm)",
43+
y_axis_label="Sepal Width (cm)",
44+
)
45+
46+
# Plot each group separately for legend
47+
for species in species_list:
48+
species_data = data[data["species"] == species]
49+
source = ColumnDataSource(data={"x": species_data["sepal_length"], "y": species_data["sepal_width"]})
50+
p.scatter(
51+
x="x", y="y", source=source, size=12, alpha=0.7, color=color_map[species], legend_label=species.capitalize()
52+
)
53+
54+
# Styling
55+
p.title.text_font_size = "20pt"
56+
p.xaxis.axis_label_text_font_size = "20pt"
57+
p.yaxis.axis_label_text_font_size = "20pt"
58+
p.xaxis.major_label_text_font_size = "16pt"
59+
p.yaxis.major_label_text_font_size = "16pt"
60+
p.legend.label_text_font_size = "16pt"
61+
p.legend.location = "top_right"
62+
p.grid.grid_line_alpha = 0.3
63+
64+
# Save
65+
export_png(p, filename="plot.png")

‎plots/highcharts/scatter/scatter-color-groups/default.py‎

Lines changed: 166 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,166 @@
1+
"""
2+
scatter-color-groups: Scatter Plot with Color Groups
3+
Library: highcharts
4+
5+
Note: Highcharts requires a license for commercial use.
6+
"""
7+
8+
import json
9+
import tempfile
10+
import time
11+
import urllib.request
12+
from pathlib import Path
13+
14+
from highcharts_core.chart import Chart
15+
from highcharts_core.options import HighchartsOptions
16+
from highcharts_core.options.series.scatter import ScatterSeries
17+
from selenium import webdriver
18+
from selenium.webdriver.chrome.options import Options
19+
20+
21+
# Color palette from style guide
22+
COLORS = ["#306998", "#FFD43B", "#DC2626", "#059669", "#8B5CF6", "#F97316"]
23+
24+
# Data - Iris dataset (sepal_length, sepal_width) by species
25+
# fmt: off
26+
iris_data = {
27+
"setosa": [
28+
(5.1, 3.5), (4.9, 3.0), (4.7, 3.2), (4.6, 3.1), (5.0, 3.6), (5.4, 3.9), (4.6, 3.4), (5.0, 3.4),
29+
(4.4, 2.9), (4.9, 3.1), (5.4, 3.7), (4.8, 3.4), (4.8, 3.0), (4.3, 3.0), (5.8, 4.0), (5.7, 4.4),
30+
(5.4, 3.9), (5.1, 3.5), (5.7, 3.8), (5.1, 3.8), (5.4, 3.4), (5.1, 3.7), (4.6, 3.6), (5.1, 3.3),
31+
(4.8, 3.4), (5.0, 3.0), (5.0, 3.4), (5.2, 3.5), (5.2, 3.4), (4.7, 3.2), (4.8, 3.1), (5.4, 3.4),
32+
(5.2, 4.1), (5.5, 4.2), (4.9, 3.1), (5.0, 3.2), (5.5, 3.5), (4.9, 3.6), (4.4, 3.0), (5.1, 3.4),
33+
(5.0, 3.5), (4.5, 2.3), (4.4, 3.2), (5.0, 3.5), (5.1, 3.8), (4.8, 3.0), (5.1, 3.8), (4.6, 3.2),
34+
(5.3, 3.7), (5.0, 3.3),
35+
],
36+
"versicolor": [
37+
(7.0, 3.2), (6.4, 3.2), (6.9, 3.1), (5.5, 2.3), (6.5, 2.8), (5.7, 2.8), (6.3, 3.3), (4.9, 2.4),
38+
(6.6, 2.9), (5.2, 2.7), (5.0, 2.0), (5.9, 3.0), (6.0, 2.2), (6.1, 2.9), (5.6, 2.9), (6.7, 3.1),
39+
(5.6, 3.0), (5.8, 2.7), (6.2, 2.2), (5.6, 2.5), (5.9, 3.2), (6.1, 2.8), (6.3, 2.5), (6.1, 2.8),
40+
(6.4, 2.9), (6.6, 3.0), (6.8, 2.8), (6.7, 3.0), (6.0, 2.9), (5.7, 2.6), (5.5, 2.4), (5.5, 2.4),
41+
(5.8, 2.7), (6.0, 2.7), (5.4, 3.0), (6.0, 3.4), (6.7, 3.1), (6.3, 2.3), (5.6, 3.0), (5.5, 2.5),
42+
(5.5, 2.6), (6.1, 3.0), (5.8, 2.6), (5.0, 2.3), (5.6, 2.7), (5.7, 3.0), (5.7, 2.9), (6.2, 2.9),
43+
(5.1, 2.5), (5.7, 2.8),
44+
],
45+
"virginica": [
46+
(6.3, 3.3), (5.8, 2.7), (7.1, 3.0), (6.3, 2.9), (6.5, 3.0), (7.6, 3.0), (4.9, 2.5), (7.3, 2.9),
47+
(6.7, 2.5), (7.2, 3.6), (6.5, 3.2), (6.4, 2.7), (6.8, 3.0), (5.7, 2.5), (5.8, 2.8), (6.4, 3.2),
48+
(6.5, 3.0), (7.7, 3.8), (7.7, 2.6), (6.0, 2.2), (6.9, 3.2), (5.6, 2.8), (7.7, 2.8), (6.3, 2.7),
49+
(6.7, 3.3), (7.2, 3.2), (6.2, 2.8), (6.1, 3.0), (6.4, 2.8), (7.2, 3.0), (7.4, 2.8), (7.9, 3.8),
50+
(6.4, 2.8), (6.3, 2.8), (6.1, 2.6), (7.7, 3.0), (6.3, 3.4), (6.4, 3.1), (6.0, 3.0), (6.9, 3.1),
51+
(6.7, 3.1), (6.9, 3.1), (5.8, 2.7), (6.8, 3.2), (6.7, 3.3), (6.7, 3.0), (6.3, 2.5), (6.5, 3.0),
52+
(6.2, 3.4), (5.9, 3.0),
53+
],
54+
}
55+
# fmt: on
56+
groups = list(iris_data.keys())
57+
58+
# Create chart with container ID for rendering
59+
chart = Chart(container="container")
60+
chart.options = HighchartsOptions()
61+
62+
# Chart configuration - 4800 x 2700 px per style guide
63+
chart.options.chart = {"type": "scatter", "width": 4800, "height": 2700, "backgroundColor": "#ffffff"}
64+
65+
# Title
66+
chart.options.title = {
67+
"text": "Iris Dataset: Sepal Dimensions by Species",
68+
"style": {"fontSize": "48px", "fontWeight": "bold"},
69+
}
70+
71+
# X-axis configuration
72+
chart.options.x_axis = {
73+
"title": {"text": "Sepal Length (cm)", "style": {"fontSize": "36px"}},
74+
"labels": {"style": {"fontSize": "28px"}},
75+
"gridLineWidth": 1,
76+
"gridLineDashStyle": "Dot",
77+
"gridLineColor": "rgba(0, 0, 0, 0.15)",
78+
}
79+
80+
# Y-axis configuration
81+
chart.options.y_axis = {
82+
"title": {"text": "Sepal Width (cm)", "style": {"fontSize": "36px"}},
83+
"labels": {"style": {"fontSize": "28px"}},
84+
"gridLineWidth": 1,
85+
"gridLineDashStyle": "Dot",
86+
"gridLineColor": "rgba(0, 0, 0, 0.15)",
87+
}
88+
89+
# Plot options for scatter
90+
chart.options.plot_options = {
91+
"scatter": {
92+
"marker": {"radius": 12, "states": {"hover": {"enabled": True, "lineColor": "rgb(100,100,100)"}}},
93+
"states": {"hover": {"marker": {"enabled": False}}},
94+
}
95+
}
96+
97+
# Add a series for each group with distinct colors
98+
for i, group in enumerate(groups):
99+
series = ScatterSeries()
100+
series.name = group.capitalize()
101+
series.data = iris_data[group]
102+
series.color = COLORS[i % len(COLORS)]
103+
chart.add_series(series)
104+
105+
# Legend configuration
106+
chart.options.legend = {
107+
"enabled": True,
108+
"align": "right",
109+
"verticalAlign": "middle",
110+
"layout": "vertical",
111+
"itemStyle": {"fontSize": "28px"},
112+
}
113+
114+
# Tooltip configuration
115+
chart.options.tooltip = {
116+
"headerFormat": "<b>{series.name}</b><br>",
117+
"pointFormat": "Sepal Length: {point.x} cm<br>Sepal Width: {point.y} cm",
118+
"style": {"fontSize": "24px"},
119+
}
120+
121+
# Disable credits
122+
chart.options.credits = {"enabled": False}
123+
124+
# Export to PNG via Selenium screenshot
125+
# Download Highcharts JS (required for headless Chrome which can't load CDN)
126+
highcharts_url = "https://code.highcharts.com/highcharts.js"
127+
with urllib.request.urlopen(highcharts_url, timeout=30) as response:
128+
highcharts_js = response.read().decode("utf-8")
129+
130+
# Get chart options as JSON
131+
opts_json = json.dumps(chart.options.to_dict())
132+
133+
html_content = f"""<!DOCTYPE html>
134+
<html>
135+
<head>
136+
<meta charset="utf-8">
137+
<script>{highcharts_js}</script>
138+
</head>
139+
<body style="margin:0; padding:0; overflow:hidden;">
140+
<div id="container" style="width: 4800px; height: 2700px;"></div>
141+
<script>
142+
Highcharts.chart('container', {opts_json});
143+
</script>
144+
</body>
145+
</html>"""
146+
147+
# Write temp HTML and take screenshot
148+
with tempfile.NamedTemporaryFile(mode="w", suffix=".html", delete=False, encoding="utf-8") as f:
149+
f.write(html_content)
150+
temp_path = f.name
151+
152+
chrome_options = Options()
153+
chrome_options.add_argument("--headless")
154+
chrome_options.add_argument("--no-sandbox")
155+
chrome_options.add_argument("--disable-dev-shm-usage")
156+
chrome_options.add_argument("--disable-gpu")
157+
chrome_options.add_argument("--window-size=4800,2800")
158+
159+
driver = webdriver.Chrome(options=chrome_options)
160+
driver.get(f"file://{temp_path}")
161+
time.sleep(5) # Wait for chart to render
162+
driver.save_screenshot("plot.png")
163+
driver.quit()
164+
165+
Path(temp_path).unlink() # Clean up temp file
166+
print("Plot saved to plot.png")

‎plots/letsplot/point/scatter-color-groups/default.py‎

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
"""
2+
scatter-color-groups: Scatter Plot with Color Groups
3+
Library: letsplot
4+
"""
5+
6+
import numpy as np
7+
import pandas as pd
8+
from lets_plot import (
9+
LetsPlot,
10+
aes,
11+
element_text,
12+
geom_point,
13+
ggplot,
14+
ggsave,
15+
ggsize,
16+
labs,
17+
scale_color_manual,
18+
theme,
19+
theme_minimal,
20+
)
21+
22+
23+
LetsPlot.setup_html()
24+
25+
# Data - Generate iris-like dataset
26+
np.random.seed(42)
27+
n_per_species = 50
28+
29+
# Setosa: smaller sepals
30+
setosa_length = np.random.normal(5.0, 0.35, n_per_species)
31+
setosa_width = np.random.normal(3.4, 0.38, n_per_species)
32+
33+
# Versicolor: medium sepals
34+
versicolor_length = np.random.normal(5.9, 0.52, n_per_species)
35+
versicolor_width = np.random.normal(2.8, 0.31, n_per_species)
36+
37+
# Virginica: larger sepals
38+
virginica_length = np.random.normal(6.6, 0.64, n_per_species)
39+
virginica_width = np.random.normal(3.0, 0.32, n_per_species)
40+
41+
data = pd.DataFrame(
42+
{
43+
"sepal_length": np.concatenate([setosa_length, versicolor_length, virginica_length]),
44+
"sepal_width": np.concatenate([setosa_width, versicolor_width, virginica_width]),
45+
"species": ["Setosa"] * n_per_species + ["Versicolor"] * n_per_species + ["Virginica"] * n_per_species,
46+
}
47+
)
48+
49+
# Custom color palette (colorblind-safe)
50+
colors = ["#306998", "#FFD43B", "#059669"]
51+
52+
# Plot
53+
plot = (
54+
ggplot(data, aes(x="sepal_length", y="sepal_width", color="species"))
55+
+ geom_point(size=4, alpha=0.7)
56+
+ scale_color_manual(values=colors)
57+
+ labs(x="Sepal Length (cm)", y="Sepal Width (cm)", title="Iris Sepal Dimensions by Species", color="Species")
58+
+ theme_minimal()
59+
+ theme(
60+
plot_title=element_text(size=20),
61+
axis_title=element_text(size=20),
62+
axis_text=element_text(size=16),
63+
legend_title=element_text(size=16),
64+
legend_text=element_text(size=16),
65+
)
66+
+ ggsize(1600, 900)
67+
)
68+
69+
# Save (scale 3x to get 4800 x 2700 px)
70+
ggsave(plot, "plot.png", path=".", scale=3)

0 commit comments

Comments
 (0)