人生地圖 Life Map

互動式人生系統視覺化工具，展示各生活面向之間的相互影響關係。

線上展示

https://ryanchen0311.github.io/life-map/

專案說明

人生地圖將十個核心生活面向建模為互聯圖中的節點。將滑鼠移至任一節點，即可高亮顯示其直接與間接影響路徑，並在下方面板中閱讀簡短說明。

功能特色

• 互動式節點圖，滑鼠移入即高亮顯示影響路徑
• 區分直接與間接影響邊線
• 活躍節點動態發光效果
• 說明面板固定在畫面底部，隨時可見
• 懸浮粒子背景覆蓋整個畫面
• 響應式版面配置

技術棧

• 純 HTML / CSS / JavaScript（單一檔案，無需建置）
• Canvas API 繪製邊線
• Tabler Icons 節點圖示
• Google Fonts — Noto Serif TC / Noto Sans TC

使用方式

直接用瀏覽器開啟 index.html，或前往上方的 GitHub Pages 連結，無需安裝任何套件。