使用示範
片長 88 秒，只有背景音樂。先示範電腦版，再示範手機版。
地圖內容
- 巴士區內每一輛巴士，按營運商真實塗裝繪畫，兩次更新之間沿道路平滑移動。點選巴士可看雙向路線及下一站。
- 火車Thameslink 及 Abbey Line 列車以車卡形式顯示於真實路軌上。點選列車可看每個停靠站的預定及預計時間和月台。列車位置按實時班次表推算，並非 GPS。
- 道路實時車速、往 M25、M1、Hatfield 及 Harpenden 的車程，以及最擠塞路段排行。
- 事故及道路工程封路、交通意外、車龍及道路工程，包括高速公路。
- 泊車停車場及咪錶街道，附官方收費及 PayByPhone 位置編號。沒有實時空位數字，因為並無公開資料。
- 電動車充電營運商有公開數據的充電樁，顯示即時狀態及每度電價錢；沒有公開數據的，則註明價錢未公開。
- 油價按油站公開價格數據顯示油價，並標示最便宜的 E10。
- 日夜模式、繁/EN日落後自動轉為夜間地圖，亦可手動切換；所有文字均可在英文及繁體中文之間轉換。
製作過程
我在 2026 年 10 月 13 及 14 日，用大約一天時間指揮 AI 代理人完成，每個版本都在螢幕上逐一檢查。
網頁以純 HTML 及 JavaScript 編寫，立體地圖使用 MapLibre GL JS。實時數據由 Cloudflare Pages Functions 擷取及快取，所有 API 金鑰只存於伺服器，不會傳到瀏覽器。
兩天內共六個版本，按我四輪意見修改：縮小巴士並令路線號碼清晰可讀、以車卡顯示列車、咪錶位在夜間亦清楚可見，以及適合手機使用的圖層抽屜。
資料來源
- 巴士bustimes.org (Bus Open Data)
- 火車Realtime Trains
- 車速、車程、事故TomTom
- 高速公路封路及工程Powered by National Highways' Transport Data Feeds
- 泊車收費St Albans City and District Council, APCOA, SABA
- 充電樁Evolt（Swarco）、MFG EV Power 及 GeniePoint 公開數據；位置來自 OpenStreetMap
- 油價Asda、MFG 及 Esso 公開價格數據
- 地圖MapLibre, OpenFreeMap, © OpenStreetMap contributors, Esri World Imagery
- 路線、天氣、搜尋OSRM, Open-Meteo, Photon (Komoot)
請注意
此為個人興趣項目，並非地方議會、巴士或鐵路營運商，或任何資料提供者的官方服務。僅供參考，請勿用作導航、安全或出行決定的依據。實時數據可能延誤、出錯或缺漏，列車位置亦只屬推算。