feat(plotly): implement gauge-basic (#5393)

## Implementation: `gauge-basic` - python/plotly

Implements the **python/plotly** version of `gauge-basic`.

**File:** `plots/gauge-basic/implementations/python/plotly.py`

**Parent Issue:** #857

---
:robot: *[impl-generate
workflow](https://github.com/MarkusNeusinger/anyplot/actions/runs/24931039693)*

---------

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>

Author: github-actions[bot]

plots/gauge-basic/implementations/python/plotly.py

@@ -1,60 +1,137 @@
-""" pyplots.ai
+""" anyplot.ai
 gauge-basic: Basic Gauge Chart
-Library: plotly 6.5.0 | Python 3.13.11
-Quality: 92/100 | Created: 2025-12-23
+Library: plotly 6.7.0 | Python 3.14.4
+Quality: 94/100 | Updated: 2026-04-25
 """
 
+import os
+
 import plotly.graph_objects as go
 
 
-# Data - Sales performance against quarterly target
-value = 72  # Current sales achievement percentage
+# Theme tokens
+THEME = os.getenv("ANYPLOT_THEME", "light")
+PAGE_BG = "#FAF8F1" if THEME == "light" else "#1A1A17"
+ELEVATED_BG = "#FFFDF6" if THEME == "light" else "#242420"
+INK = "#1A1A17" if THEME == "light" else "#F0EFE8"
+INK_SOFT = "#4A4A44" if THEME == "light" else "#B8B7B0"
+INK_MUTED = "#6B6A63" if THEME == "light" else "#A8A79F"
+
+# Okabe-Ito colorblind-safe stand-ins for the red/amber/green convention
+ZONE_LOW = "#D55E00"  # vermillion (bad)
+ZONE_MID = "#E69F00"  # orange (caution)
+ZONE_HIGH = "#009E73"  # bluish green — Okabe-Ito brand (good)
+
+# Data — Sales target achievement for the quarter
+value = 72
 min_value = 0
 max_value = 100
-thresholds = [30, 70]  # Red/Yellow/Green zones
+thresholds = [30, 70]
 
-# Create gauge chart
+# Plot
 fig = go.Figure(
     go.Indicator(
         mode="gauge+number",
         value=value,
+        number={"font": {"size": 96, "color": INK}, "suffix": "%"},
         title={
-            "text": "Sales Target Achievement<br><span style='font-size:24px'>gauge-basic · plotly · pyplots.ai</span>",
-            "font": {"size": 32},
+            "text": (
+                "<b>Sales Target Achievement</b>"
+                f"<br><span style='font-size:22px;color:{INK_SOFT}'>"
+                "gauge-basic · plotly · anyplot.ai</span>"
+            ),
+            "font": {"size": 32, "color": INK},
         },
-        number={"font": {"size": 72}, "suffix": "%"},
         gauge={
+            "shape": "angular",
             "axis": {
                 "range": [min_value, max_value],
-                "tickwidth": 3,
-                "tickcolor": "#306998",
-                "tickfont": {"size": 22},
+                "tickwidth": 2,
+                "tickcolor": INK_SOFT,
+                "tickfont": {"size": 18, "color": INK_SOFT},
                 "ticksuffix": "%",
                 "dtick": 10,
             },
-            "bar": {"color": "#306998", "thickness": 0.25},
-            "bgcolor": "white",
-            "borderwidth": 3,
-            "bordercolor": "#306998",
+            # Slim needle-style indicator so the zone colors stay visible
+            "bar": {"color": INK, "thickness": 0.06, "line": {"color": INK, "width": 0}},
+            "bgcolor": ELEVATED_BG,
+            "borderwidth": 1,
+            "bordercolor": INK_SOFT,
             "steps": [
-                {"range": [min_value, thresholds[0]], "color": "#FF6B6B"},
-                {"range": [thresholds[0], thresholds[1]], "color": "#FFD43B"},
-                {"range": [thresholds[1], max_value], "color": "#4CAF50"},
+                {"range": [min_value, thresholds[0]], "color": ZONE_LOW},
+                {"range": [thresholds[0], thresholds[1]], "color": ZONE_MID},
+                {"range": [thresholds[1], max_value], "color": ZONE_HIGH},
             ],
-            "threshold": {"line": {"color": "#306998", "width": 8}, "thickness": 0.85, "value": value},
+            "threshold": {"line": {"color": INK, "width": 5}, "thickness": 0.95, "value": value},
         },
-        domain={"x": [0.05, 0.95], "y": [0.1, 0.95]},
+        domain={"x": [0.05, 0.95], "y": [0.30, 0.95]},
     )
 )
 
-# Layout for 4800x2700 px
+# Layout — page surface + zone legend + target-exceeded callout
 fig.update_layout(
-    font={"family": "Arial", "size": 22},
-    paper_bgcolor="white",
-    plot_bgcolor="white",
-    margin={"l": 80, "r": 80, "t": 120, "b": 60},
+    paper_bgcolor=PAGE_BG,
+    plot_bgcolor=PAGE_BG,
+    font={"family": "Arial", "color": INK},
+    margin={"l": 80, "r": 80, "t": 140, "b": 120},
+    annotations=[
+        # Zone legend row — three color-coded chips below the gauge
+        {
+            "x": 0.20,
+            "y": 0.14,
+            "xref": "paper",
+            "yref": "paper",
+            "text": (
+                f"<span style='color:{ZONE_LOW};font-size:24px'>●</span>  "
+                f"<b>At Risk</b>  "
+                f"<span style='color:{INK_MUTED}'>0–30%</span>"
+            ),
+            "showarrow": False,
+            "font": {"size": 18, "color": INK},
+        },
+        {
+            "x": 0.50,
+            "y": 0.14,
+            "xref": "paper",
+            "yref": "paper",
+            "text": (
+                f"<span style='color:{ZONE_MID};font-size:24px'>●</span>  "
+                f"<b>On Track</b>  "
+                f"<span style='color:{INK_MUTED}'>30–70%</span>"
+            ),
+            "showarrow": False,
+            "font": {"size": 18, "color": INK},
+        },
+        {
+            "x": 0.80,
+            "y": 0.14,
+            "xref": "paper",
+            "yref": "paper",
+            "text": (
+                f"<span style='color:{ZONE_HIGH};font-size:24px'>●</span>  "
+                f"<b>Exceeds Target</b>  "
+                f"<span style='color:{INK_MUTED}'>70–100%</span>"
+            ),
+            "showarrow": False,
+            "font": {"size": 18, "color": INK},
+        },
+        # Target-exceeded callout — emphasises the threshold-crossing story
+        {
+            "x": 0.5,
+            "y": 0.02,
+            "xref": "paper",
+            "yref": "paper",
+            "text": "<b>✓ Target Exceeded</b>  ·  72% surpasses the 70% goal",
+            "showarrow": False,
+            "font": {"size": 22, "color": ZONE_HIGH},
+            "bgcolor": ELEVATED_BG,
+            "bordercolor": ZONE_HIGH,
+            "borderwidth": 2,
+            "borderpad": 12,
+        },
+    ],
 )
 
-# Save as PNG and HTML
-fig.write_image("plot.png", width=1600, height=900, scale=3)
-fig.write_html("plot.html")
+# Save
+fig.write_image(f"plot-{THEME}.png", width=1600, height=900, scale=3)
+fig.write_html(f"plot-{THEME}.html", include_plotlyjs="cdn")