tw-showing-route｜集體帶看行程表
房仲店的「集體帶看」（集看）：一次要帶同事或客戶看 5～10 間物件，誰先誰後常常排得繞來繞去。
把物件清單（Excel／CSV）丟進來，這個網頁會：
- 自動排出最順的順序（12 間以內保證是直線距離最短的順序）
- 畫出地圖：編號標記、專任／一般不同顏色、建議路線
- 產生行程表：售價、坪數、格局、現況、帶看方式、經紀人……一次列清楚，可直接列印發給大家
- 一鍵開 Google 地圖導航：整趟路線，或每一站「從上一站」導航，不需要申請 API 金鑰
免安裝、免伺服器：雙擊 index.html 就能用。物件資料只存在你這台電腦的瀏覽器。
線上試用（示範資料）：https://larryveryhandsome.github.io/tw-showing-route/
適合誰
- 房仲門市的集體帶看、新人認識商圈、店長巡案
- 任何「一天要跑好幾個地點」的人：估價、驗屋、清潔派工、業務拜訪、送貨
5 分鐘開始
- 下載這個專案（綠色 Code 按鈕 → Download ZIP），解壓縮。
- 雙擊
index.html。一開始會顯示 8 間示範物件（地址、價格全部是假的）。
- 打開
data/showings.example.csv（可用 Excel 開），換成你這次要看的物件，
用「另存新檔 → CSV UTF-8（逗號分隔）」存檔。
- 回到網頁，展開最下面的「資料來源」→「選擇 CSV 檔」。
- 看地圖和表格，按 列印／存 PDF 發給同事；出發時按 Google 地圖導航全程。
座標怎麼填
每間物件需要座標才能排順序、上地圖：
- 在 Google 地圖找到物件，在那個位置按右鍵（手機長按）。
- 選單第一行就是座標（例如
24.1477, 120.6736），點一下就複製了。
- 貼到 CSV 的「座標」欄，或分別填「緯度」「經度」兩欄都可以。
沒填座標的物件還是會列在表格最後面，導航連結會改用地址。
不想自動排順序
把右上角「自動排最順的順序」取消勾選，就會照 CSV 的「順序」欄（數字小的先）；沒填順序的照列的先後。
設定（config.js）
用記事本打開 config.js：
| 設定 | 說明 |
|---|
title | 網頁和列印的標題 |
start | 出發點（店面）的名稱和座標 |
fields | CSV 欄位名稱：順序、地址、緯度、經度、座標、委託類型 |
tableFields | 表格要顯示哪些欄位、順序；[] 代表全部 |
colors | 地圖顏色，例如專任藍色、一般紅色 |
travelMode | 導航方式：driving 開車、walking 走路、bicycling、transit |
tiles | 地圖底圖，預設 OpenStreetMap（免費、不用金鑰） |
欄位可以自己加減；表格只會顯示 tableFields 裡有的欄位。
怎麼排順序
- 距離用兩點間的直線距離估算（不呼叫任何外部服務，所以不用金鑰、不會把地址送出去）。
- 出發點固定，走完最後一間就結束，不算回程。
- 12 間以內：用動態規劃（Held-Karp）算出保證最短的順序。
- 超過 12 間：先「每次去最近的下一間」，再用 2-opt、or-opt 修正，結果通常很接近最短。
- 點很多時（實測 100 點約 0.1 秒、500 點約 1.5 秒）改善步驟最多花約 1.5 秒就收工，不會卡住網頁，但結果可能略差於最短。
- 直線最短不一定等於開車最快（單行道、河流、山路），出發前請看一下地圖。
- Google 地圖導航一次最多 9 個中途點，超過會自動切成好幾段連結。
給開發者
index.html 畫面（Leaflet 1.9.4 從 unpkg 載入，有 SRI 完整性檢查；沒網路時只顯示表格）
css/style.css 樣式（含列印、深色模式）
config.js 設定
data/sample.js 網頁內建的示範資料（和範本 CSV 內容相同，測試會檢查）
data/showings.example.csv CSV 範本
js/route.js 路線核心：CSV 解析、座標、距離、排序、Google 地圖連結（純函式）
js/app.js 畫面邏輯
tests/ 單元測試（node:test，不用裝任何套件）
npm test
測試會用暴力法驗證：12 間以內的順序和真正最短的完全一樣。
注意事項
- 示範資料的座標是隨便挑的位置，地址和價格都是假的。
- 距離和順序原則上僅供參考，實際路況與交通規則以現場為準。
- 地圖資料 © OpenStreetMap contributors。大量使用時請遵守 OpenStreetMap 圖磚使用政策。
已知問題
- 地圖用 OpenStreetMap 公開圖磚，只適合少量使用；大量使用請改成自己的圖磚（config.js 的 tiles）。目前沒有附自備圖磚的範例，暫無計畫。
- 距離是直線距離，順序只是建議，不是實際路況。
- 座標要自己填，沒有自動地址轉座標。
- 只實測 Chromium（桌機與 375 寬）。
完整的發布前檢查（八道閘門）見 RELEASE_CHECK.md。
需要哪些金鑰？
不需要任何金鑰、帳號或付費服務。 距離在你的瀏覽器裡計算，地圖用免費的 OpenStreetMap 圖磚，Google 地圖導航只是一個開新分頁的連結（不呼叫 API）。所以沒有 docs/金鑰申請.md。
授權
Apache License 2.0
🛠️ 需要客製化？
這個工具是開源的，可以免費使用。如果你想要：
- 改成符合你們公司的流程、欄位或品牌
- 串接你現在在用的系統（LINE、Google 表單、POS、會計軟體……）
- 幫你安裝、架站、教學，或長期維護
歡迎加 LINE 跟我們聊。我們會依需求的範圍與複雜度報價，原則上以實際報價單為準。
- 💬 LINE：林其衞（請註明「集體帶看行程 客製化」）
- 🏢 留白事務所：網頁設計、AI 自動化、房仲遠端助理
- 👤 作者：留白事務所
