7️⃣ 部署與分享地圖

🎯 為什麼要部署 Folium 地圖？

Folium 產生的地圖預設是 HTML 檔案，如果要與其他人分享或整合進 Web 應用程式，我們可以使用 Flask、Django 或直接上傳到 GitHub Pages。

✅ 適用場景：

單獨分享 HTML 檔案（適合快速展示）
嵌入 Flask / Django 網站（適合動態應用）
上傳到 GitHub Pages / Netlify（適合靜態網站）

✅ 1. 儲存地圖為 HTML 並分享

Folium 內建 .save() 方法，可以直接匯出 HTML 檔案。

import folium

m = folium.Map(location=[25.0330, 121.5654], zoom_start=12)
m.save("my_map.html")

✅ 開啟 my_map.html，可在瀏覽器查看。

✅ 2. 在 Flask 中嵌入 Folium 地圖

如果要將地圖嵌入 Flask 網站，可以用 m._repr_html_() 來直接顯示地圖。

🔹 建立 Flask 應用

from flask import Flask, render_template
import folium

app = Flask(__name__)

@app.route("/")
def index():
    m = folium.Map(location=[25.0330, 121.5654], zoom_start=12)
    map_html = m._repr_html_()
    return render_template("index.html", map=map_html)

if __name__ == "__main__":
    app.run(debug=True)

✅ 這樣 Folium 地圖就可以動態顯示在 Flask 應用了！

🔹 index.html 檔案內容：

<!DOCTYPE html>
<html>
<head>
    <title>Folium 地圖</title>
</head>
<body>
    {{ map|safe }}
</body>
</html>

✅ 3. 上傳到 GitHub Pages / Netlify

如果要讓地圖 長期公開，可以把 HTML 檔案上傳到 GitHub Pages。

🔹 上傳到 GitHub Pages

建立 GitHub Repository
上傳 my_map.html
在 Repository 設定 GitHub Pages
透過 https://username.github.io/repository-name/my_map.html 存取地圖

🔹 使用 Netlify 部署（適合多人共享）

建立 Netlify 帳號
上傳 my_map.html 到 Netlify
Netlify 會產生一個公開網址，方便分享

✅ 這樣你就可以讓你的地圖在網路上隨時被存取！

📝 總結

方式	適用場景	優勢
儲存 HTML	個人使用、離線展示	簡單易用，不需要伺服器
Flask / Django	動態應用程式	可以整合後端 API，支援互動功能
GitHub Pages	長期分享	免費、易於存取
Netlify 部署	靜態網站	方便多人共享，支援 HTTPS

🚀 現在你已經學會如何部署與分享 Folium 地圖！恭喜完成 Folium 教學！🎉