Merge branch 'main' into implementation/bar-basic/plotly

Author: github-actions[bot]

plots/bar-basic/implementations/altair.py

@@ -1,41 +1,74 @@
 """ pyplots.ai
 bar-basic: Basic Bar Chart
-Library: altair 6.0.0 | Python 3.13.11
-Quality: 93/100 | Created: 2025-12-23
+Library: altair 6.0.0 | Python 3.14
+Quality: 92/100 | Created: 2025-12-23
 """
 
 import altair as alt
 import pandas as pd
 
 
 # Data - Product sales by category (realistic retail scenario)
+# Includes close-valued pairs (Clothing/Home & Garden, Toys/Food) to showcase comparison
 data = pd.DataFrame(
     {
         "category": ["Electronics", "Clothing", "Home & Garden", "Sports", "Books", "Toys", "Food"],
-        "value": [45200, 32100, 28400, 21800, 18500, 15200, 12300],
+        "value": [45200, 31500, 29800, 21800, 18500, 14200, 13100],
     }
 )
 
-# Chart
-chart = (
+# Highlight the top-performing category
+data["is_top"] = data["value"] == data["value"].max()
+
+# Sort order by descending value
+sort_order = data.sort_values("value", ascending=False)["category"].tolist()
+
+# Chart - bars with conditional color to highlight leader
+bars = (
     alt.Chart(data)
-    .mark_bar(color="#306998", cornerRadiusTopLeft=4, cornerRadiusTopRight=4)
+    .mark_bar(cornerRadiusTopLeft=4, cornerRadiusTopRight=4)
     .encode(
         x=alt.X(
             "category:N",
             title="Product Category",
-            sort="-y",
+            sort=sort_order,
             axis=alt.Axis(labelAngle=-45, labelFontSize=18, titleFontSize=22),
         ),
-        y=alt.Y("value:Q", title="Sales ($)", axis=alt.Axis(labelFontSize=18, titleFontSize=22, format="$,.0f")),
+        y=alt.Y(
+            "value:Q",
+            title="Sales ($)",
+            scale=alt.Scale(domain=[0, 50000]),
+            axis=alt.Axis(
+                labelFontSize=18, titleFontSize=22, format="$,.0f", values=[0, 10000, 20000, 30000, 40000, 50000]
+            ),
+        ),
+        color=alt.condition(alt.datum.is_top, alt.value("#FFD43B"), alt.value("#306998")),
         tooltip=[alt.Tooltip("category:N", title="Category"), alt.Tooltip("value:Q", title="Sales", format="$,.0f")],
     )
-    .properties(width=1500, height=800, title=alt.Title(text="bar-basic · altair · pyplots.ai", fontSize=28))
+)
+
+# Value labels above bars
+labels = bars.mark_text(align="center", baseline="bottom", dy=-8, fontSize=16, color="#333333").encode(
+    text=alt.Text("value:Q", format="$,.0f"), color=alt.value("#333333")
+)
+
+# Annotation highlighting top performer
+annotation = (
+    alt.Chart(pd.DataFrame({"category": ["Electronics"], "value": [45200], "label": ["Top seller — $45.2k"]}))
+    .mark_text(align="center", baseline="bottom", dy=-28, fontSize=18, fontWeight="bold", color="#b8860b")
+    .encode(x=alt.X("category:N", sort=sort_order), y=alt.Y("value:Q"), text=alt.Text("label:N"))
+)
+
+# Combine bars + labels + annotation
+chart = (
+    (bars + labels + annotation)
+    .properties(width=1600, height=900, title=alt.Title(text="bar-basic · altair · pyplots.ai", fontSize=28))
     .configure_view(strokeWidth=0)
-    .configure_axis(grid=True, gridOpacity=0.3, gridDash=[4, 4])
+    .configure_axis(grid=False)
+    .configure_axisY(grid=True, gridOpacity=0.15, gridDash=[4, 4])
 )
 
-# Save as PNG (scale_factor=3 gives 4500x2400, close to target 4800x2700)
+# Save as PNG (scale_factor=3 gives 4800x2700 at 1600x900)
 chart.save("plot.png", scale_factor=3.0)
 
 # Save interactive HTML

plots/bar-basic/implementations/bokeh.py

@@ -1,64 +1,88 @@
 """ pyplots.ai
 bar-basic: Basic Bar Chart
-Library: bokeh 3.8.1 | Python 3.13.11
-Quality: 92/100 | Created: 2025-12-23
+Library: bokeh 3.8.2 | Python 3.14
+Quality: 90/100 | Created: 2025-12-23
 """
 
 from bokeh.io import export_png
-from bokeh.models import ColumnDataSource, LabelSet
+from bokeh.models import ColumnDataSource, LabelSet, NumeralTickFormatter
 from bokeh.plotting import figure, output_file, save
 
 
-# Data - Product sales by category
-categories = ["Electronics", "Clothing", "Home & Garden", "Sports", "Books", "Toys"]
-values = [42500, 31200, 28700, 19800, 15400, 12600]
+# Data - Quarterly revenue by department (varied, non-monotonic pattern)
+categories = ["Engineering", "Marketing", "Sales", "Support", "Design", "Operations"]
+values = [38200, 21500, 45800, 14300, 27600, 19100]
+labels = [f"${v / 1000:.1f}K" for v in values]
 
 # Create ColumnDataSource
-source = ColumnDataSource(data={"categories": categories, "values": values})
+source = ColumnDataSource(data={"categories": categories, "values": values, "labels": labels})
 
-# Create figure with categorical x-axis (4800 × 2700 px)
+# Create figure with categorical x-axis (4800 x 2700 px)
 p = figure(
     x_range=categories,
     width=4800,
     height=2700,
-    title="bar-basic · bokeh · pyplots.ai",
-    x_axis_label="Product Category",
-    y_axis_label="Sales ($)",
+    title="bar-basic \u00b7 bokeh \u00b7 pyplots.ai",
+    x_axis_label="Department",
+    y_axis_label="Revenue ($)",
     toolbar_location=None,
 )
 
-# Create bars
-p.vbar(x="categories", top="values", source=source, width=0.7, color="#306998", alpha=0.9)
+# Create bars with white edge for definition
+p.vbar(
+    x="categories", top="values", source=source, width=0.7, color="#306998", alpha=0.9, line_color="white", line_width=2
+)
 
-# Add value labels on top of bars
-labels = LabelSet(
+# Add formatted value labels above bars
+labels_glyph = LabelSet(
     x="categories",
     y="values",
-    text="values",
+    text="labels",
     level="glyph",
-    x_offset=-25,
-    y_offset=5,
+    x_offset=0,
+    y_offset=8,
     source=source,
     text_font_size="28pt",
     text_color="#333333",
+    text_align="center",
 )
-p.add_layout(labels)
+p.add_layout(labels_glyph)
 
-# Styling for 4800×2700 px
+# Styling for 4800x2700 px
 p.title.text_font_size = "36pt"
 p.title.align = "center"
 p.xaxis.axis_label_text_font_size = "28pt"
 p.yaxis.axis_label_text_font_size = "28pt"
 p.xaxis.major_label_text_font_size = "24pt"
 p.yaxis.major_label_text_font_size = "24pt"
 
-# Grid styling
+# Clean L-shaped frame: remove top and right spines
+p.outline_line_color = None
+p.xaxis.axis_line_color = "#333333"
+p.yaxis.axis_line_color = "#333333"
+p.xaxis.axis_line_width = 2
+p.yaxis.axis_line_width = 2
+
+# Remove tick marks, keep labels
+p.xaxis.major_tick_line_color = None
+p.yaxis.major_tick_line_color = None
+p.xaxis.minor_tick_line_color = None
+p.yaxis.minor_tick_line_color = None
+
+# Grid styling - y-axis only, subtle solid lines
 p.xgrid.grid_line_color = None
-p.ygrid.grid_line_alpha = 0.3
-p.ygrid.grid_line_dash = "dashed"
+p.ygrid.grid_line_alpha = 0.2
+p.ygrid.grid_line_dash = "solid"
 
-# Y-axis starts at 0
+# Format y-axis with dollar amounts
+p.yaxis.formatter = NumeralTickFormatter(format="$0,0")
+
+# Y-axis starts at 0, add headroom for labels
 p.y_range.start = 0
+p.y_range.end = max(values) * 1.15
+
+# Background
+p.background_fill_color = "#FFFFFF"
 
 # Save as PNG
 export_png(p, filename="plot.png")