Update app.py

app.py

@@ -1,345 +1,328 @@
-
-# app.py (pure HTML/folium version: no PNG charts)
 import os
+import io
 import json
-import tempfile
-from datetime import datetime, timedelta
-from typing import List, Dict, Any, Tuple
+from datetime import datetime, timedelta, timezone
 
-import gradio as gr
-import pandas as pd
 import requests
-import folium
+import pandas as pd
+import matplotlib.pyplot as plt
+import gradio as gr
 
-BASE_URL = "https://opendata.cwa.gov.tw/api/v1/rest/datastore/E-A0015-001"
 
-TILE_CHOICES = {
-    "OpenStreetMap": "OpenStreetMap",
-    "CartoDB Positron": "CartoDB positron",
-    "Stamen Terrain": "Stamen Terrain",
-    "Esri World Imagery (衛星)": "Esri.WorldImagery"
-}
+# -----------------------------
+# 時區：台北 (UTC+8)
+# -----------------------------
+TAIPEI_TZ = timezone(timedelta(hours=8))
 
-def validate_iso(dt: str) -> str:
-    if not dt:
-        return ""
-    try:
-        datetime.strptime(dt, "%Y-%m-%dT%H:%M:%S")
-        return dt
-    except ValueError:
-        raise gr.Error("時間格式需為 yyyy-MM-ddThh:mm:ss")
-
-def build_params(limit: int|None, offset: int|None, fmt: str, sort: str|None, timeFrom: str|None, timeTo: str|None):
-    params = []
-    api_key = os.getenv("CWA_API_KEY")
+def now_taipei():
+    return datetime.now(TAIPEI_TZ)
+
+def fmt_dt(dt: datetime) -> str:
+    return dt.strftime("%Y-%m-%dT%H:%M:%S")
+
+
+# -----------------------------
+# 快速時間範圍
+# -----------------------------
+def set_time_range(hours: int | None = None, days: int | None = None):
+    """
+    依台北時間回傳 (timeFrom, timeTo) 字串（yyyy-MM-ddTHH:mm:ss）
+    """
+    now = now_taipei()
+    if hours is not None:
+        t_from = now - timedelta(hours=hours)
+    elif days is not None:
+        t_from = now - timedelta(days=days)
+    else:
+        t_from = now - timedelta(days=3)  # 預設最近 3 天
+    return fmt_dt(t_from), fmt_dt(now)
+
+
+# -----------------------------
+# 呼叫 CWA E-A0015-001 API
+# -----------------------------
+API_URL = "https://opendata.cwa.gov.tw/api/v1/rest/datastore/E-A0015-001"
+
+def fetch_reports(time_from: str, time_to: str) -> dict:
+    """
+    以環境變數 CWA_API_KEY 做授權參數呼叫 API，回傳 JSON 物件（dict）
+    """
+    api_key = os.getenv("CWA_API_KEY", "").strip()
     if not api_key:
-        raise gr.Error("缺少授權碼：請到 Space 的 Settings → Repository secrets 新增 CWA_API_KEY。")
-    params.append(("Authorization", api_key))
-    if limit is not None: params.append(("limit", str(limit)))
-    if offset is not None: params.append(("offset", str(offset)))
-    if fmt: params.append(("format", fmt))
-    if sort: params.append(("sort", sort))
-    if timeFrom: params.append(("timeFrom", timeFrom))
-    if timeTo: params.append(("timeTo", timeTo))
-    return params
-
-def http_get(url: str, params: List[Tuple[str,str]]) -> Dict[str, Any]:
-    sess = requests.Session()
-    resp = sess.get(url, params=params, timeout=(5, 20))
+        raise RuntimeError("環境變數 CWA_API_KEY 未設定。請在 Space Secrets 設定。")
+
+    params = {
+        "Authorization": api_key,
+        "timeFrom": time_from,
+        "timeTo": time_to,
+        # 其餘參數保持預設；排序改由本地處理，以避免介面差異
+    }
+    resp = requests.get(API_URL, params=params, timeout=30)
     resp.raise_for_status()
-    if "application/json" in resp.headers.get("Content-Type","").lower() or resp.text.strip().startswith("{"):
-        return resp.json()
-    else:
-        return {"raw": resp.text}
-
-def extract_records(payload: Dict[str, Any]):
-    recs = payload.get("records")
-    if isinstance(recs, dict):
-        for k, v in recs.items():
-            if isinstance(v, list):
-                return v
-    result = payload.get("result")
-    if isinstance(result, dict) and isinstance(result.get("records"), list):
-        return result["records"]
-    for key in ("Earthquake","earthquakes","data","items"):
-        v = payload.get(key)
-        if isinstance(v, list):
-            return v
-    return []
-
-def flatten_row(row: Dict[str, Any]) -> Dict[str, Any]:
-    out = {}
-    for key in ("EarthquakeNo","ReportImageURI","Web","ReportColor","ReportContent"):
-        if key in row:
-            out[key] = row.get(key)
-    eqi = row.get("EarthquakeInfo")
-    if isinstance(eqi, dict):
-        out["OriginTime"] = eqi.get("OriginTime")
-        out["Depth_km"] = eqi.get("FocalDepth")
-        mag = eqi.get("EarthquakeMagnitude") or {}
-        if isinstance(mag, dict):
-            out["Magnitude"] = mag.get("MagnitudeValue")
-            out["MagnitudeType"] = mag.get("MagnitudeType")
-        epic = eqi.get("Epicenter") or {}
-        if isinstance(epic, dict):
-            out["Epicenter"] = epic.get("Location")
-            out["EpicenterLon"] = epic.get("EpicenterLongitude")
-            out["EpicenterLat"] = epic.get("EpicenterLatitude")
-    for k in ("OriginTime","originTime","Time"):
-        if k in row and "OriginTime" not in out:
-            out["OriginTime"] = row.get(k)
-    for k in ("Depth","depth","FocalDepth"):
-        if k in row and "Depth_km" not in out:
-            out["Depth_km"] = row.get(k)
-    for k in ("Magnitude","mag"):
-        if k in row and "Magnitude" not in out:
-            out["Magnitude"] = row.get(k)
-    maxint = row.get("Intensity") or row.get("ShakingArea")
-    if isinstance(maxint, dict):
-        out["MaxIntensity"] = maxint.get("MaxIntensity")
-    return out
-
-def df_with_types(df: pd.DataFrame) -> pd.DataFrame:
-    if "OriginTime" in df.columns:
-        try:
-            df["OriginTime"] = pd.to_datetime(df["OriginTime"], format="%Y-%m-%dT%H:%M:%S", errors="coerce")
-        except Exception:
-            pass
-    if "Magnitude" in df.columns:
-        df["Magnitude"] = pd.to_numeric(df["Magnitude"], errors="coerce")
-    if "Depth_km" in df.columns:
-        df["Depth_km"] = pd.to_numeric(df["Depth_km"], errors="coerce")
+    return resp.json()
+
+
+# -----------------------------
+# 解析 JSON → pandas.DataFrame
+# 只保留必要欄位（不含 area / station 等）
+# -----------------------------
+def safe_get(d, *keys, default=None):
+    cur = d
+    for k in keys:
+        if isinstance(cur, dict) and k in cur:
+            cur = cur[k]
+        else:
+            return default
+    return cur
+
+def parse_ea0015(json_obj: dict) -> pd.DataFrame:
+    """
+    嘗試容錯各種大小寫與路徑差異，輸出欄位：
+    OriginTime, Lat, Lon, Depth_km, Magnitude, Location, ReportURL
+    """
+    records = json_obj.get("records") or json_obj.get("Records") or {}
+    quakes = (
+        records.get("earthquake") or
+        records.get("Earthquake") or
+        records.get("data") or
+        []
+    )
+
+    rows = []
+    for q in quakes:
+        origin = safe_get(q, "originTime") or safe_get(q, "OriginTime")
+        # 經緯度 & 深度
+        lat = (
+            safe_get(q, "epicenter", "epicenterLat") or
+            safe_get(q, "Epicenter", "EpicenterLat")
+        )
+        lon = (
+            safe_get(q, "epicenter", "epicenterLon") or
+            safe_get(q, "Epicenter", "EpicenterLon")
+        )
+        depth = (
+            safe_get(q, "depth") or
+            safe_get(q, "Depth")
+        )
+        # 規模
+        mag = (
+            safe_get(q, "magnitude", "magnitudeValue") or
+            safe_get(q, "Magnitude", "MagnitudeValue") or
+            safe_get(q, "magnitude", "magnitude") or
+            safe_get(q, "Magnitude", "Magnitude")
+        )
+        # 位置與連結
+        loc = (
+            safe_get(q, "epicenter", "location") or
+            safe_get(q, "Epicenter", "Location")
+        )
+        url = safe_get(q, "reportURL") or safe_get(q, "ReportURL")
+
+        rows.append({
+            "OriginTime": origin,
+            "Lat": _to_float(lat),
+            "Lon": _to_float(lon),
+            "Depth_km": _to_float(depth),
+            "Magnitude": _to_float(mag),
+            "Location": loc,
+            "ReportURL": url,
+        })
+
+    df = pd.DataFrame(rows)
+
+    # 轉時間、排序（預設：OriginTime 由新到舊）
+    if not df.empty:
+        df["OriginTime"] = pd.to_datetime(df["OriginTime"], errors="coerce")
+        df = df.sort_values("OriginTime", ascending=False, na_position="last").reset_index(drop=True)
+
     return df
 
-def add_tw_bbox(m: folium.Map):
-    bounds = [(21.0, 119.0), (26.0, 123.0)]
-    folium.Rectangle(bounds=bounds, color="#444", fill=False, weight=2, dash_array="5").add_to(m)
-
-def add_legend(m: folium.Map):
-    html = '''
-    <div style="position: fixed; bottom: 10px; right: 10px; z-index:9999; background: rgba(255,255,255,0.9); padding: 8px 10px; border:1px solid #999; border-radius:6px; font-size:12px;">
-      <div style="font-weight:600; margin-bottom:4px;">圖例</div>
-      <div><span style="display:inline-block;width:12px;height:12px;background:#abd9e9;margin-right:6px;border:1px solid #999;"></span> M4.0–4.9</div>
-      <div><span style="display:inline-block;width:12px;height:12px;background:#fdae61;margin-right:6px;border:1px solid #999;"></span> M5.0–5.9</div>
-      <div><span style="display:inline-block;width:12px;height:12px;background:#d7191c;margin-right:6px;border:1px solid #999;"></span> M≥6.0</div>
-      <div style="margin-top:4px;">圓徑 ≈ 規模 × 2.5</div>
-    </div>
-    '''
-    folium.Marker(location=[0,0], icon=folium.DivIcon(html=html)).add_to(m)
-
-def make_map(df: pd.DataFrame, tile_choice: str) -> str:
-    if not {"EpicenterLat","EpicenterLon"}.issubset(df.columns):
-        return "<p>沒有可用的經緯度資料。</p>"
-    valid = df.dropna(subset=["EpicenterLat","EpicenterLon"]).copy()
-    if valid.empty:
-        return "<p>沒有可用的經緯度資料。</p>"
+def _to_float(x):
     try:
-        valid["EpicenterLat"] = pd.to_numeric(valid["EpicenterLat"], errors="coerce")
-        valid["EpicenterLon"] = pd.to_numeric(valid["EpicenterLon"], errors="coerce")
+        if x is None or x == "":
+            return None
+        return float(str(x).strip())
     except Exception:
-        pass
-    valid = valid.dropna(subset=["EpicenterLat","EpicenterLon"])
-    if valid.empty:
-        return "<p>沒有可用的經緯度資料。</p>"
-    tiles = TILE_CHOICES.get(tile_choice, "OpenStreetMap")
-    if tiles == "Esri.WorldImagery":
-        m = folium.Map(location=[valid["EpicenterLat"].mean(), valid["EpicenterLon"].mean()], zoom_start=6, tiles=None)
-        folium.TileLayer(
-            tiles="https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
-            attr="Tiles © Esri — Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community",
-            name="Esri World Imagery"
-        ).add_to(m)
-    else:
-        m = folium.Map(location=[valid["EpicenterLat"].mean(), valid["EpicenterLon"].mean()], zoom_start=6, tiles=tiles)
-    add_tw_bbox(m)
-    for _, r in valid.iterrows():
-        lat = float(r["EpicenterLat"]); lon = float(r["EpicenterLon"])
-        mag = r.get("Magnitude", None)
-        radius = 4.0
-        try:
-            if pd.notna(mag):
-                radius = max(4.0, min(20.0, float(mag) * 2.5))
-        except Exception:
-            pass
-        color = "#2c7bb6"
-        try:
-            if mag is not None and float(mag) >= 6.0:
-                color = "#d7191c"
-            elif mag is not None and float(mag) >= 5.0:
-                color = "#fdae61"
-            elif mag is not None and float(mag) >= 4.0:
-                color = "#abd9e9"
-        except Exception:
-            pass
-        popup = folium.Popup(html=f"<b>時間</b>: {r.get('OriginTime','')}<br>"
-                                  f"<b>震央</b>: {r.get('Epicenter','')}<br>"
-                                  f"<b>規模</b>: {mag}<br>"
-                                  f"<b>深度</b>: {r.get('Depth_km','')} km", max_width=320)
-        folium.CircleMarker(location=[lat, lon], radius=radius, color=color, fill=True, fill_opacity=0.7, popup=popup).add_to(m)
-    add_legend(m)
-    return m._repr_html_()
-
-def fetch(time_from, time_to, limit, offset, fmt, sort, tile_choice):
-    time_from = validate_iso(time_from) if time_from else None
-    time_to = validate_iso(time_to) if time_to else None
-    params = build_params(limit=limit, offset=offset, fmt=fmt, sort=sort, timeFrom=time_from, timeTo=time_to)
-    payload = http_get(BASE_URL, params)
-    records = extract_records(payload)
-    flat = [flatten_row(r) for r in records]
-    df = pd.DataFrame(flat)
-    df = df_with_types(df)
-    if "OriginTime" in df.columns:
-        ascending = True if sort == "OriginTime" else False
-        df = df.sort_values("OriginTime", ascending=ascending)
-    tmpdir = tempfile.mkdtemp(prefix="cwa_")
-    csv_path = os.path.join(tmpdir, "cwa_quake.csv")
-    json_path = os.path.join(tmpdir, "raw.json")
-    geojson_path = os.path.join(tmpdir, "cwa_quake.geojson")
-    kml_path = os.path.join(tmpdir, "cwa_quake.kml")
-    df.to_csv(csv_path, index=False, encoding="utf-8")
-    with open(json_path, "w", encoding="utf-8") as f:
-        json.dump(payload, f, ensure_ascii=False, indent=2)
-    # Write GeoJSON
-    to_geojson(df, geojson_path)
-    # Write KML
-    to_kml(df, kml_path)
-    total = len(df)
-    earliest = latest = ""
-    if total and "OriginTime" in df.columns:
-        earliest_row = df.iloc[0]; latest_row = df.iloc[-1]
-        def fmt_row(r):
-            ot = r.get("OriginTime","")
-            if isinstance(ot, pd.Timestamp):
-                ot = ot.strftime("%Y-%m-%dT%H:%M:%S")
-            return f"{ot} | {r.get('Epicenter','')} | M{r.get('Magnitude','')} | 深{r.get('Depth_km','')}km"
-        earliest = "最早: " + fmt_row(earliest_row)
-        latest = "最新: " + fmt_row(latest_row)
-    summary = f"取得筆數: {total}\n{earliest}\n{latest}"
-    html_map = make_map(df, tile_choice)
-    if "OriginTime" in df.columns:
-        df["OriginTime"] = df["OriginTime"].astype(str)
-    return df, summary, csv_path, json_path, html_map, geojson_path, kml_path
-
-def to_geojson(df: pd.DataFrame, path: str) -> str:
-    if not {"EpicenterLat","EpicenterLon"}.issubset(df.columns):
-        with open(path, "w", encoding="utf-8") as f:
-            json.dump({"type":"FeatureCollection","features":[]}, f)
-        return path
-    features = []
-    for _, r in df.iterrows():
-        try:
-            lat = float(r.get("EpicenterLat"))
-            lon = float(r.get("EpicenterLon"))
-        except (TypeError, ValueError):
-            continue
-        props = {
-            "OriginTime": str(r.get("OriginTime","")),
-            "Epicenter": r.get("Epicenter",""),
-            "Magnitude": r.get("Magnitude",""),
-            "Depth_km": r.get("Depth_km","")
-        }
-        features.append({
-            "type": "Feature",
-            "geometry": {"type": "Point", "coordinates": [lon, lat]},
-            "properties": props
-        })
-    fc = {"type":"FeatureCollection", "features": features}
-    with open(path, "w", encoding="utf-8") as f:
-        json.dump(fc, f, ensure_ascii=False, indent=2)
-    return path
-
-def to_kml(df: pd.DataFrame, path: str) -> str:
-    def esc(s):
-        return str(s).replace("&","&amp;").replace("<","&lt;").replace(">","&gt;")
-    kml = [
-        '<?xml version="1.0" encoding="UTF-8"?>',
-        '<kml xmlns="http://www.opengis.net/kml/2.2">',
-        "<Document>"
-    ]
-    if {"EpicenterLat","EpicenterLon"}.issubset(df.columns):
-        for _, r in df.iterrows():
-            try:
-                lat = float(r.get("EpicenterLat"))
-                lon = float(r.get("EpicenterLon"))
-            except (TypeError, ValueError):
-                continue
-            name = f"M{r.get('Magnitude','')} {r.get('Epicenter','')}"
-            desc = f"時間: {r.get('OriginTime','')}\n深度: {r.get('Depth_km','')} km"
-            kml.extend([
-                "<Placemark>",
-                f"<name>{esc(name)}</name>",
-                f"<description>{esc(desc)}</description>",
-                "<Point>",
-                f"<coordinates>{lon},{lat},0</coordinates>",
-                "</Point>",
-                "</Placemark>"
-            ])
-    kml.append("</Document></kml>")
-    with open(path, "w", encoding="utf-8") as f:
-        f.write("\n".join(kml))
-    return path
-
-def quick_range(hours: int):
-    now = datetime.now()
-    tf = (now - timedelta(hours=hours)).strftime("%Y-%m-%dT%H:%M:%S")
-    tt = now.strftime("%Y-%m-%dT%H:%M:%S")
-    return tf, tt
-
-with gr.Blocks(title="CWA 顯著有感地震報告 (E-A0015-001)") as demo:
-    gr.Markdown("# CWA 顯著有感地震報告 (E-A0015-001)")
-    gr.Markdown("**此 Space 只使用環境變數 `CWA_API_KEY` 作為授權。** 預設查詢最近 3 天。")
-
-    tf_default = (datetime.now() - timedelta(days=3)).strftime("%Y-%m-%dT%H:%M:%S")
-    tt_default = datetime.now().strftime("%Y-%m-%dT%H:%M:%S")
-
-    time_from = gr.Textbox(label="timeFrom yyyy-MM-ddThh:mm:ss", value=tf_default)
-    time_to = gr.Textbox(label="timeTo yyyy-MM-ddThh:mm:ss", value=tt_default)
-    with gr.Row():
-        btn6 = gr.Button("最近 6 小時")
-        btn12 = gr.Button("最近 12 小時")
-        btn24 = gr.Button("最近 24 小時")
-        btn3d = gr.Button("最近 3 天")
-    sort = gr.Dropdown(choices=[None, "OriginTime"], value=None, label="sort（預設降冪；選 OriginTime 會升冪）")
-    limit = gr.Number(label="limit（筆數上限）", precision=0, value=60)
-    offset = gr.Number(label="offset（起始偏移）", precision=0, value=0)
-    fmt = gr.Radio(choices=["JSON","XML"], value="JSON", label="回傳格式")
-    tile_choice = gr.Dropdown(choices=list(TILE_CHOICES.keys()), value="OpenStreetMap", label="地圖底圖")
-
-    auto_on = gr.Checkbox(label="每小時自動刷新（固定使用目前 timeFrom/timeTo）", value=False)
-    timer = gr.Timer(3600.0)
-
-    run_btn = gr.Button("查詢", variant="primary")
-
-    out_df = gr.Dataframe(label="查詢結果（扁平化）", interactive=False, wrap=True, datatype="str")
-    out_summary = gr.Textbox(label="摘要", interactive=False)
-    out_csv = gr.File(label="下載 CSV")
-    out_json = gr.File(label="下載原始 JSON")
-    out_map = gr.HTML(label="震央地圖")
-    out_geojson = gr.File(label="下載 GeoJSON")
-    out_kml = gr.File(label="下載 KML")
-
-    def on_click(time_from, time_to, limit, offset, fmt, sort, tile_choice):
-        df, summary, csv_path, json_path, html_map, geojson_path, kml_path = fetch(
-            time_from, time_to, int(limit) if limit is not None else None, int(offset) if offset is not None else None,
-            fmt, sort, tile_choice
+        return None
+
+
+# -----------------------------
+# 視覺化：趨勢圖、台灣地圖
+# -----------------------------
+TAIWAN_BBOX = (119, 123, 21, 26)  # lon_min, lon_max, lat_min, lat_max
+
+def plot_trend(df: pd.DataFrame) -> bytes | None:
+    """時間-規模散點圖，輸出 PNG bytes"""
+    if df.empty:
+        return None
+    fig, ax = plt.subplots(figsize=(6, 3.8))
+    ax.scatter(df["OriginTime"], df["Magnitude"])
+    ax.set_xlabel("Origin Time (Taipei)")
+    ax.set_ylabel("Magnitude")
+    ax.grid(True, linestyle="--", alpha=0.4)
+    fig.autofmt_xdate()
+
+    buf = io.BytesIO()
+    fig.savefig(buf, format="png", dpi=160, bbox_inches="tight")
+    plt.close(fig)
+    buf.seek(0)
+    return buf.getvalue()
+
+def plot_taiwan_map(df: pd.DataFrame) -> bytes | None:
+    """
+    基礎台灣範圍框圖（非海岸線），用散點展示震央；
+    以規模對應 marker 大小，附簡易圖例。
+    """
+    if df.empty:
+        return None
+
+    lon_min, lon_max, lat_min, lat_max = TAIWAN_BBOX
+    fig, ax = plt.subplots(figsize=(6, 6))
+
+    # 邊框
+    ax.set_xlim(lon_min, lon_max)
+    ax.set_ylim(lat_min, lat_max)
+    ax.set_xlabel("Longitude (°E)")
+    ax.set_ylabel("Latitude (°N)")
+    ax.set_title("Epicenters in Taiwan Region (119–123E, 21–26N)")
+
+    # 散點：大小反映規模
+    mags = df["Magnitude"].fillna(0)
+    sizes = (mags.clip(lower=0) + 2.0) ** 3  # 調整一下讓差異更明顯
+    ax.scatter(df["Lon"], df["Lat"], s=sizes, alpha=0.6, edgecolor="black")
+
+    # 簡單圖例：M3/4/5/6 對應大小
+    for m in [3, 4, 5, 6]:
+        ax.scatter([], [], s=((m + 2.0) ** 3), alpha=0.6, edgecolor="black", label=f"M {m}")
+    ax.legend(title="Magnitude", loc="upper right", frameon=True)
+
+    ax.grid(True, linestyle="--", alpha=0.3)
+
+    buf = io.BytesIO()
+    fig.savefig(buf, format="png", dpi=160, bbox_inches="tight")
+    plt.close(fig)
+    buf.seek(0)
+    return buf.getvalue()
+
+
+# -----------------------------
+# 主流程：查詢 + 輸出
+# -----------------------------
+def query_and_render(time_from: str, time_to: str, sort_order: str):
+    """
+    1) 取資料 → 2) 轉成 DataFrame → 3) 依排序輸出 → 4) 回傳表格、圖、CSV
+    Gradio 會接收回傳值更新元件。
+    """
+    try:
+        raw = fetch_reports(time_from, time_to)
+    except Exception as e:
+        return gr.update(value=f"查詢錯誤：{e}"), None, None, None
+
+    try:
+        df = parse_ea0015(raw)
+        if df.empty:
+            return "（查無資料）", None, None, None
+
+        # 排序（本地）
+        if sort_order == "OriginTime (舊→新)":
+            df = df.sort_values("OriginTime", ascending=True, na_position="last").reset_index(drop=True)
+        else:
+            df = df.sort_values("OriginTime", ascending=False, na_position="last").reset_index(drop=True)
+
+        # 表格（轉為 markdown 簡表，手機閱讀較清楚）
+        md = df_to_markdown(df)
+
+        # 圖
+        trend_png = plot_trend(df)
+        map_png = plot_taiwan_map(df)
+
+        # 下載 CSV（以 bytes 形式回傳給 DownloadButton）
+        csv_bytes = df.to_csv(index=False).encode("utf-8-sig")
+
+        return md, trend_png, map_png, csv_bytes
+    except Exception as e:
+        return gr.update(value=f"解析錯誤：{e}"), None, None, None
+
+
+def df_to_markdown(df: pd.DataFrame, top_n: int = 100) -> str:
+    """
+    將前 top_n 筆轉為 markdown 表（欄位：OriginTime, Magnitude, Depth_km, Lat, Lon, Location, ReportURL）
+    """
+    if df.empty:
+        return "（查無資料）"
+
+    show_cols = ["OriginTime", "Magnitude", "Depth_km", "Lat", "Lon", "Location", "ReportURL"]
+    exist_cols = [c for c in show_cols if c in df.columns]
+    slim = df[exist_cols].head(top_n).copy()
+
+    # 時間顯示（台北時區）
+    if "OriginTime" in slim.columns:
+        slim["OriginTime"] = slim["OriginTime"].dt.tz_convert(TAIPEI_TZ).dt.strftime("%Y-%m-%d %H:%M:%S %Z")
+
+    return slim.to_markdown(index=False)
+
+
+# -----------------------------
+# Gradio 介面
+# -----------------------------
+default_from, default_to = set_time_range(days=3)
+
+with gr.Blocks(fill_height=True, analytics_enabled=False) as demo:
+    gr.Markdown(
+        """
+# CWA 顯著有感地震報告 (E-A0015-001)
+此 Space **只使用環境變數 `CWA_API_KEY` 作為授權**。  
+預設查詢 **最近 3 天（台北時間）**。手機版為單欄顯示。
+        """
+    )
+
+    # 單欄（手機友好）
+    with gr.Column():
+        with gr.Row():
+            time_from = gr.Textbox(label="timeFrom yyyy-MM-ddThh:mm:ss", value=default_from, scale=1)
+        with gr.Row():
+            time_to   = gr.Textbox(label="timeTo yyyy-MM-ddThh:mm:ss", value=default_to, scale=1)
+
+        # 快速時間範圍（已移除「最近6小時」）
+        with gr.Row():
+            btn_12h = gr.Button("最近 12 小時")
+            btn_24h = gr.Button("最近 24 小時")
+            btn_3d  = gr.Button("最近 3 天")
+            btn_5d  = gr.Button("最近 5 天")
+
+        # 排序（在地端）
+        sort_dd = gr.Dropdown(
+            choices=["OriginTime (新→舊)", "OriginTime (舊→新)"],
+            value="OriginTime (新→舊)",
+            label="排序（本地）"
         )
-        return df, summary, csv_path, json_path, html_map, geojson_path, kml_path
 
-    def on_tick(auto_on, time_from, time_to, limit, offset, fmt, sort, tile_choice):
-        if not auto_on:
-            return [gr.skip()] * 7
-        return on_click(time_from, time_to, limit, offset, fmt, sort, tile_choice)
+        run_btn = gr.Button("查詢", variant="primary")
+
+        # 輸出
+        table_out = gr.Markdown("（尚未查詢）")
+        trend_out = gr.Image(label="趨勢圖（時間-規模）", type="numpy")
+        map_out   = gr.Image(label="台灣範圍圖（119–123E, 21–26N）", type="numpy")
+        dl_btn    = gr.DownloadButton(label="下載 CSV", file_name="CWA_E-A0015-001.csv")
 
-    run_btn.click(on_click, inputs=[time_from, time_to, limit, offset, fmt, sort, tile_choice],
-                  outputs=[out_df, out_summary, out_csv, out_json, out_map, out_geojson, out_kml])
+    # 綁定：快速鍵 → 更新時間欄位
+    btn_12h.click(lambda: set_time_range(hours=12), outputs=[time_from, time_to])
+    btn_24h.click(lambda: set_time_range(hours=24), outputs=[time_from, time_to])
+    btn_3d.click(lambda: set_time_range(days=3), outputs=[time_from, time_to])
+    btn_5d.click(lambda: set_time_range(days=5), outputs=[time_from, time_to])
 
-    btn6.click(lambda: quick_range(6), inputs=[], outputs=[time_from, time_to])
-    btn12.click(lambda: quick_range(12), inputs=[], outputs=[time_from, time_to])
-    btn24.click(lambda: quick_range(24), inputs=[], outputs=[time_from, time_to])
-    btn3d.click(lambda: ((datetime.now() - timedelta(days=3)).strftime("%Y-%m-%dT%H:%M:%S"), datetime.now().strftime("%Y-%m-%dT%H:%M:%S")), inputs=[], outputs=[time_from, time_to])
+    # 綁定：查詢 → 表格 / 圖 / CSV
+    def _on_query(tfrom, tto, sort_sel):
+        md, trend_png, map_png, csv_bytes = query_and_render(tfrom, tto, sort_sel)
+        # DownloadButton 需要返回 bytes-like 物件
+        return md, trend_png, map_png, csv_bytes
 
-    timer.tick(on_tick, inputs=[auto_on, time_from, time_to, limit, offset, fmt, sort, tile_choice],
-               outputs=[out_df, out_summary, out_csv, out_json, out_map, out_geojson, out_kml])
+    run_btn.click(
+        _on_query,
+        inputs=[time_from, time_to, sort_dd],
+        outputs=[table_out, trend_out, map_out, dl_btn]
+    )
 
+# 注意：Hugging Face Spaces 會自動呼叫 demo.launch()
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch()