highlight-graph

你正在构建一个交互式 2D 力导向图，可视化用户的 Readwise 摘录，展示书籍、文章和其他来源中的观点如何彼此关联。可以把它想成 Obsidian 的关系图视图，不过展示的是摘录。

Readwise 访问

检查是否有可用的 Readwise MCP 工具（例如 mcp__readwise__readwise_list_highlights）。如果有，请在整个过程中使用这些工具；如果没有，则改用等效的 readwise CLI 命令。

流程

第 1 步：获取摘录

先显示：

摘录关系图 · Readwise

我会获取你最近的摘录，找出它们之间的关联，并构建一个供你探索的关系图。请稍等。

使用 readwise_list_highlights 获取用户最近的摘录，设置 page_size=100。获取 2 页（200 条摘录），作为不错的起始关系图。每页的摘录按时间从近到远排列——先使用 page=1，再使用 page=2。

第 2 步：准备摘录数据

解析 API 响应，并构建一个摘录 JSON 数组。每条摘录需要包含：

{
  "id": "12345",
  "text": "The actual highlight text...",
  "note": "User's note if any",
  "book_id": 58741401,
  "source_title": "The Goal",
  "source_author": "Eliyahu Goldratt",
  "url": "https://..."
}

重要： Readwise API 会返回 book_id，但不会随每条摘录返回书籍／文章标题或作者。你必须通过阅读摘录文本和任何可用的元数据（URL、内容模式）自行识别来源标题和作者。按 book_id 对摘录分组，并根据上下文推断来源。无法确定作者时可以使用“Unknown”，但请尽量识别标题。

将此数组写入临时文件：/tmp/highlights.json

第 3 步：初次渲染（不含关联）

创建一个空的关联文件，并运行构建脚本，让用户立即看到内容：

echo '[]' > /tmp/connections.json
python3 SKILL_DIR/build_graph.py --highlights /tmp/highlights.json --connections /tmp/connections.json --output highlight-graph.html
open highlight-graph.html

告知用户：

关系图已打开，包含 {N} 条摘录，来自 {N} 个来源。现在正在寻找观点之间的关联……

第 4 步：寻找跨来源关联

启动并行子 Agent（3～5 个），寻找来自不同来源的摘录之间的语义关联。每个 Agent 应分析一批摘录并返回关联。

分批策略：

1. 按来源（book_id）对摘录分组。
2. 将来源拆分为每批约 8 个来源。
3. 对每一对批次（包括同一批次内部），向一个 Agent 提供这些来源的摘录文本。
4. 每个 Agent 应找出 5～10 个真实的概念关联，例如不同来源之间共享的主题、观点或表述。

每个 Agent 应返回一个关联 JSON 数组：

[
  {
    "a_id": "12345",
    "b_id": "67890",
    "label": "Feedback loops",
    "why": "Both highlights discuss how tight feedback loops improve quality"
  }
]

质量重于数量。 只有在关联真实且值得关注时才创建关联。对于 200 条摘录，15～30 条跨来源关联是理想数量。

第 5 步：加入关联后重新构建

将所有 Agent 的结果合并为一个关联 JSON 数组，写入 /tmp/connections.json，然后重新运行构建脚本：

python3 SKILL_DIR/build_graph.py --highlights /tmp/highlights.json --connections /tmp/connections.json --output highlight-graph.html
open highlight-graph.html

总结结果：

已构建关系图，包含来自 {N} 个来源的 {N} 条摘录，观点之间共有 {N} 条关联。

我发现了几条有趣的关联：

• “{摘录 A 片段}” ↔ “{摘录 B 片段}” — {关联标签}
• ...

关系图已在浏览器中打开。要添加更多摘录吗？

第 6 步：迭代

• 更多摘录： 获取其他页面（page=3、page=4 等），重新识别来源、寻找新关联并重新构建。
• 按主题筛选： 使用 readwise_search_highlights 获取特定主题或特定书籍中的摘录，并仅用这些摘录重新构建。

构建脚本

build_graph.py（位于此技能的目录中）负责所有可视化逻辑。它接收两个 JSON 文件，并输出一个独立的 HTML 文件：

python3 build_graph.py --highlights highlights.json --connections connections.json --output output.html

highlights.json： {id, text, note, book_id, source_title, source_author, url} 数组 connections.json： {a_id, b_id, label, why} 数组

脚本会处理：

• 高亮内容的去重与筛选
• 为每个来源分配颜色（rose-pine 调色板）
• 同一来源的完全两两连接（同一本书中的所有高亮内容均相连）
• 跨来源的语义连接（带粒子的紫色虚线边）
• 交互式侧边栏面板，显示关联想法和同一本书中的高亮内容
• 防止标签重叠
• 按屏幕相对大小缩放文本（在任意缩放级别下大小一致）
• 可点击筛选的来源图例
• 悬停隔离与选择状态保持

输出是一个使用 CDN 加载 force-graph 的单一 HTML 文件。无需服务器，只需在浏览器中打开。

SKILL_DIR

在上面的命令中，将 SKILL_DIR 替换为此技能目录的实际路径（即 build_graph.py 所在的位置）。