個人數位帳戶連結管理系統

這是一個基於網頁的思維導圖工具，專為管理個人數位帳戶連結而設計。此系統可以在本地編輯，並將數據存儲到 GitHub 上，實現雲端文字化存儲和本地可視化編輯的結合。

功能特色

• 直觀的拖放式思維導圖界面
• 節點之間的關聯可視化
• 自定義分類系統
• 本地存儲功能
• GitHub 導出/導入功能
• JSON 格式導出/導入
• 搜索功能

部署到 GitHub Pages

步驟 1: 創建一個新的 GitHub 倉庫

1. 前往 GitHub 並登入您的帳戶
2. 點擊右上角的 + 按鈕，選擇 New repository
3. 輸入倉庫名稱，例如 mindmap
4. 可選: 添加描述
5. 選擇 Public (如果您希望它是公開的)
6. 點擊 Create repository

步驟 2: 上傳文件

1. 將本頁面的 HTML 文件保存為 index.html
2. 在您的倉庫中點擊 Add file > Upload files
3. 拖放或選擇 index.html 文件
4. 輸入提交訊息，例如 "初始上傳"
5. 點擊 Commit changes

步驟 3: 啟用 GitHub Pages

1. 在您的倉庫頁面，點擊 Settings
2. 在左側菜單中，點擊 Pages
3. 在 "Source" 部分，從下拉菜單中選擇 main 分支
4. 選擇 / (root) 作為文件夾
5. 點擊 Save
6. 等待幾分鐘，您的站點將在 https://<your-username>.github.io/<repository-name> 可用

數據結構

系統使用以下 JSON 格式存儲數據:

{
  "nodes": [
    {
      "id": "node_id",
      "title": "節點標題",
      "url": "https://example.com",
      "description": "節點描述",
      "category": "分類名稱",
      "x": 100,
      "y": 200
    }
  ],
  "connections": [
    {
      "from": "parent_node_id",
      "to": "child_node_id"
    }
  ],
  "categories": ["工作", "個人", "社交", "學習", "娛樂", "財務", "健康", "其他"]
}

語言模型整合指南

如果您希望使用語言模型 (如 GPT 系列) 來處理您的數據，請使用以下標準格式:

數據查詢

以下是向語言模型提問的範例:

請分析我的思維導圖數據:

{
  "nodes": [...],
  "connections": [...],
  "categories": [...]
}

我想知道我的帳戶分類是否合理，以及有哪些改進建議?

數據修改

若要請求語言模型幫您修改數據，可以使用:

請幫我優化我的思維導圖數據:

{
  "nodes": [...],
  "connections": [...],
  "categories": [...]
}

我希望添加一個新的"健康應用"分類，並將所有健康相關的節點歸入這一分類。

語言模型應該能夠返回完整的、可直接導入系統的 JSON 格式數據。

注意事項

• 您的 GitHub 個人訪問令牌 (Personal Access Token) 僅在當前會話中使用，不會被保存
• 確保您的令牌有足夠的權限 (repo 權限)
• 建議定期備份您的數據
• 此工具完全在前端運行，數據不會發送到任何第三方服務器 (除了 GitHub，如果您使用該功能)

技術細節

• 純 JavaScript 實現，無需後端
• 使用 HTML5 Canvas 和 DOM 元素混合渲染
• 響應式設計，適應不同屏幕大小
• 本地使用 localStorage 作為臨時存儲

自定義和擴展

這個系統設計為最小可行產品 (MVP)，您可以根據需要擴展功能:

1. 添加更多節點屬性
2. 實現更複雜的連接類型
3. 添加節點圖標或縮略圖
4. 添加更多數據可視化選項
5. 集成其他雲存儲服務

故障排除

如果遇到問題:

1. 無法保存到 GitHub: 檢查您的令牌權限和倉庫是否存在
2. 無法載入數據: 嘗試清除瀏覽器緩存或使用導入功能重新載入數據
3. 界面顯示問題: 刷新頁面或調整窗口大小
4. 節點拖動問題: 確保未啟用瀏覽器擴展干擾拖放功能