Update app.py

app.py

@@ -10,6 +10,7 @@ import numpy as np
 import matplotlib.dates as mdates
 import folium
 from matplotlib import cm
+import branca.colormap as bcm
 
 from grafanalib.core import (
     Dashboard, Graph, Row, Target, YAxis, YAxes, Time
@@ -208,13 +209,25 @@ def _to_hex_color(value: float, cmap=cm.viridis) -> str:
     return "#{:02x}{:02x}{:02x}".format(int(rgba[0]*255), int(rgba[1]*255), int(rgba[2]*255))
 
 
-def render_map_folium(df: pd.DataFrame, value_col: str = "amplitude", size_col: str = "count") -> str:
-    """用 folium 建立互動地圖，回傳 HTML"""
+def render_map_folium(df: pd.DataFrame, value_col: str = "amplitude",
+                      size_col: str = "count", cmap_name: str = "viridis",
+                      tiles: str = "OpenStreetMap") -> str:
+    """用 folium 建立互動地圖，帶顏色圖例"""
     center_lat, center_lon = df["lat"].mean(), df["lon"].mean()
-    m = folium.Map(location=[center_lat, center_lon], zoom_start=7)
+    m = folium.Map(location=[center_lat, center_lon], zoom_start=7, tiles=tiles)
 
     vmin, vmax = df[value_col].min(), df[value_col].max()
+    cmap = getattr(cm, cmap_name)
 
+    # 建立 folium colormap (legend)
+    colormap = bcm.LinearColormap(
+        [ _to_hex_color(i, cmap) for i in np.linspace(0, 1, 256) ],
+        vmin=vmin, vmax=vmax
+    )
+    colormap.caption = f"{value_col} (color scale)"
+    colormap.add_to(m)
+
+    # 加點資料
     for _, row in df.iterrows():
         norm_val = (row[value_col] - vmin) / (vmax - vmin + 1e-9)
         folium.CircleMarker(
@@ -224,7 +237,7 @@ def render_map_folium(df: pd.DataFrame, value_col: str = "amplitude", size_col:
             weight=1,
             fill=True,
             fill_opacity=0.7,
-            fill_color=_to_hex_color(norm_val),
+            fill_color=_to_hex_color(norm_val, cmap),
             popup=f"{value_col}: {row[value_col]:.2f}, {size_col}: {row[size_col]}"
         ).add_to(m)
 
@@ -234,7 +247,7 @@ def render_map_folium(df: pd.DataFrame, value_col: str = "amplitude", size_col:
 # -----------------------------
 # Main pipeline
 # -----------------------------
-def pipeline(source, file, sheet_url, series_choice, dual_axis, rolling_window):
+def pipeline(source, file, sheet_url, series_choice, dual_axis, rolling_window, cmap_choice, tiles_choice):
     df = load_data(source, file, sheet_url)
     numeric_cols = [c for c in df.columns if c not in ["time", "lat", "lon"] and pd.api.types.is_numeric_dtype(df[c])]
     chosen = [c for c in (series_choice or numeric_cols[:2]) if c in numeric_cols]
@@ -251,7 +264,8 @@ def pipeline(source, file, sheet_url, series_choice, dual_axis, rolling_window):
     fig2 = render_bar_or_dual(df, chosen[1], chosen[0], bool(dual_axis)) if len(chosen) > 1 else plt.figure()
     fig3, df_with_roll = render_rolling(df.copy(), chosen[0], int(rolling_window))
 
-    map_html = render_map_folium(df, value_col=chosen[0], size_col="count")
+    map_html = render_map_folium(df, value_col=chosen[0], size_col="count",
+                                 cmap_name=cmap_choice, tiles=tiles_choice)
 
     demo_df = make_demo_dataframe()
     with tempfile.NamedTemporaryFile(delete=False, suffix=".csv", mode="w", encoding="utf-8") as f:
@@ -261,15 +275,15 @@ def pipeline(source, file, sheet_url, series_choice, dual_axis, rolling_window):
     return fig1, fig2, fig3, map_html, dash_json_str, json_path, df_with_roll, demo_csv_path
 
 
-def regenerate_demo(series_choice, dual_axis, rolling_window):
-    return pipeline("demo", None, "", series_choice, dual_axis, rolling_window)
+def regenerate_demo(series_choice, dual_axis, rolling_window, cmap_choice, tiles_choice):
+    return pipeline("demo", None, "", series_choice, dual_axis, rolling_window, cmap_choice, tiles_choice)
 
 
 # -----------------------------
 # UI
 # -----------------------------
 with gr.Blocks(theme=gr.themes.Soft()) as demo:
-    gr.Markdown("## Grafana-like Demo + Folium Map")
+    gr.Markdown("## Grafana-like Demo + Folium Map + Colormap + Tiles + Legend")
 
     source_radio = gr.Radio(["upload", "drive", "demo"], label="資料來源", value="demo")
     file_in = gr.File(label="上傳 CSV（僅在選擇 upload 時使用）", file_types=[".csv"])
@@ -278,6 +292,13 @@ with gr.Blocks(theme=gr.themes.Soft()) as demo:
     series_multiselect = gr.CheckboxGroup(label="數值欄位", choices=[])
     dual_axis_chk = gr.Checkbox(label="第二面板啟用雙軸", value=False)
     rolling_dd = gr.Dropdown(label="Rolling window", choices=["3", "5", "10", "20"], value="5")
+    cmap_dd = gr.Dropdown(label="地圖配色 (colormap)",
+                          choices=["viridis", "plasma", "inferno", "magma", "cividis", "coolwarm"],
+                          value="viridis")
+    tiles_dd = gr.Dropdown(label="地圖底圖 (tiles)",
+                           choices=["OpenStreetMap", "Stamen Terrain", "Stamen Toner",
+                                    "CartoDB positron", "CartoDB dark_matter"],
+                           value="OpenStreetMap")
 
     run_btn = gr.Button("產生 Dashboard")
     regen_btn = gr.Button("🔁 重新產生示範資料")
@@ -285,7 +306,7 @@ with gr.Blocks(theme=gr.themes.Soft()) as demo:
     plot1 = gr.Plot(label="1：Line")
     plot2 = gr.Plot(label="2：Bar / Dual Axis")
     plot3 = gr.Plot(label="3：Rolling Mean")
-    map_out = gr.HTML(label="4：Geo Map (Interactive)")
+    map_out = gr.HTML(label="4：Geo Map (Interactive + Legend)")
 
     json_box = gr.Code(label="grafanalib Dashboard JSON", language="json")
     json_file = gr.File(label="下載 dashboard.json")
@@ -302,20 +323,20 @@ with gr.Blocks(theme=gr.themes.Soft()) as demo:
     sheet_url_box.change(probe_columns, inputs=[source_radio, file_in, sheet_url_box], outputs=[series_multiselect, df_view])
 
     demo.load(
-        lambda: pipeline("demo", None, "", [], False, "5"),
+        lambda: pipeline("demo", None, "", [], False, "5", "viridis", "OpenStreetMap"),
         inputs=None,
         outputs=[plot1, plot2, plot3, map_out, json_box, json_file, df_view, demo_csv_file]
     )
 
     run_btn.click(
         pipeline,
-        inputs=[source_radio, file_in, sheet_url_box, series_multiselect, dual_axis_chk, rolling_dd],
+        inputs=[source_radio, file_in, sheet_url_box, series_multiselect, dual_axis_chk, rolling_dd, cmap_dd, tiles_dd],
         outputs=[plot1, plot2, plot3, map_out, json_box, json_file, df_view, demo_csv_file]
     )
 
     regen_btn.click(
         regenerate_demo,
-        inputs=[series_multiselect, dual_axis_chk, rolling_dd],
+        inputs=[series_multiselect, dual_axis_chk, rolling_dd, cmap_dd, tiles_dd],
         outputs=[plot1, plot2, plot3, map_out, json_box, json_file, df_view, demo_csv_file]
     )