使用地图¶

地图是一块由卡片和连接线组成的看板。每张卡片代表应用的一个组成部分：一个大的区域（如“主服务器”）、一组文件、单个文件，或一个端点（服务器可以接收的请求）。连接线显示各部分之间的使用关系。

浏览与导航¶

当你缩小时，卡片上的细节会简化：描述消失，标题变大，因此即使从远处看，地图仍然清晰可读。

卡片¶

• 标题和描述： 一个通俗易懂的名称，以及一句话的功能说明。
• 页脚： 左侧显示内部包含多少内容（模块、文件或端点）。右侧在属于近期工作时显示绿色标签。
• 端点卡片 在名称上方显示方法和地址（POST /api/orders）。
• 标题后面的小琥珀色圆点 表示该文件上有一条固定的笔记。
• 视图边缘的胶囊形卡片 表示视图之外的内容。每列上方的括号说明它们属于哪一侧：
• 被使用： 使用或调用当前部分的外部内容。
• ‹name› 内部： 当前部分由哪些内容组成。
• 使用： 当前部分所依赖的外部内容，例如数据库或 Stripe。

双击外部卡片即可跳转过去。

将鼠标悬停在卡片上一会儿，可以看到它是什么类型、位于哪里以及有多大。将鼠标悬停在连接线上，可以看到它承载的是什么，例如某个页面会调用哪些端点。

侧边面板¶

点击任何内容，即可在面板中查看：其完整描述、属于哪一部分、内部包含什么、被谁使用、依赖什么、它的端点，以及打开或询问相关信息的按钮。未选中任何内容时，面板会描述当前视图；在顶层时，则描述整个应用。

拖动面板左边缘可调整其大小。

顶栏按钮¶

健康¶

重要问题的数量，以及扫描发现的问题的通俗语言列表：

• 密码和密钥被写入代码，或写入已提交的 .env 文件；
• 允许任何人无需登录即可修改或读取数据的端点；
• 没有被任何内容使用的文件；
• 超过约 1,000 行的文件，AI 难以安全编辑。

每个问题都有 在地图上显示，它会用笔记高亮受影响的文件和端点；还有 用 Claude 修复（对于在 Codex 中制作的地图，则为 用 Codex 修复），它会复制一个现成的提示词，指明确切的文件、行号和安全的修复方法。这是一种快速的自动检查，并非安全审计。在蓝图中，此按钮改为 审查（见 蓝图）。

最近的工作¶

当 Claude 或 Codex 刚刚完成更改时，“最近的工作”会出现。它会将发生更改的卡片排列在一块看板上，包含你请求的内容、完成内容的摘要，以及每张卡片上的笔记。在地图的其他位置，发生更改的卡片带有绿色圆环和 已更改 或 新增 标签；包含这些卡片的部件会显示 N 处更改，这样你就可以从顶层顺着绿色一路找到底层。

页面¶

Floorplan 检测到的应用中的每个页面。选择一个即可看到它背后的一切：其组件、它发出的请求、响应这些请求的服务器代码、所涉及的数据，以及外部服务。

导出¶

保存一份地图副本，以便发送给任何人，例如队友、客户，或没有 Claude 或 Codex 的人。它是一个 HTML 文件，无需安装任何内容即可在任何浏览器中打开。副本包含整张地图、搜索、页面、导览和流程，但没有 Ask 栏，没有 用 Claude 修复 或 构建这个 请求，没有编辑器链接，也没有任何关于你计算机的信息（例如其文件夹路径）。标题旁的 已导出 标签显示日期，底部的小型 由 Floorplan 制作 链接指向这里。

你可以选择包含哪些内容：

• 流程和导览，以及 固定在文件上的笔记，默认开启；
• 最近的工作，默认关闭；
• 健康检查（或蓝图上的 设计审查），默认关闭。健康检查会列出任何人都能使用的端点，以及密钥在代码中的位置（绝不会是它们的值），因此只为你信任的人包含此项。

每个副本都会展示应用如何组合在一起（每个部件、文件和端点，附带名称和描述），但不包含你的源代码。导出需要地图的服务器；对于直接从文件打开的地图，按钮会显示要运行的命令。你也可以让 Claude 或 Codex “导出 floorplan”。

从这里开始¶

重播你第一次打开地图时播放的一分钟导览。

流程¶

应用主要任务的引导式演练，例如“结账”或“注册”。流程会一步步在看板上移动，每一步都有讲解。使用 ← / → 或流程栏的按钮逐步浏览，按 Esc 停止。

请求新流程 让你用通俗语言描述一个流程（例如“退款如何退回客户的卡上？”），Claude 或 Codex 会在代码中追踪它。你请求的流程会随地图一起保存。

筛选器¶

• 显示连接： 开启或关闭各类连接线（使用关系、Web 请求、后台任务等）。
• 显示技术细节： 切换为开发者术语（导入、HTTP、队列），并显示每个文件的导出项。
• 高亮最近的工作： 关闭绿色高亮，以得到干净的地图。

提问¶

在底部的 Ask 栏中输入内容，然后按 Enter。Claude 或 Codex 会用几句话作答，并显示一个 答案面板：只包含涉及的卡片、它们的连接方式、每张卡片上的简短说明，以及当答案是一个序列时的编号步骤讲解。回答下方会出现后续建议。返回地图 会回到你之前的位置。

• 在任何卡片或连线上，Right-click → Ask about this 会将其作为上下文添加到你的问题中。
• 栏中的标签显示当前由谁来回答。Claude Code 表示 Claude Code CLI，Codex 表示 Codex，两者都在你的计算机上运行，并且能够读取你的源代码。Claude 表示地图已在 Claude 应用中打开，它仅根据地图内容进行回答。
• 如果两者都不可用，栏中会说明需要什么。请参阅故障排除。

蓝图¶

以上内容描述的是现有代码的地图，这也是大多数地图的形态。蓝图则是另一种类型：在代码存在之前，根据 PRD 或规范规划出的地图（参见入门指南）。它的工作方式相同，但有以下几点区别：

• 虚线卡片和 Blueprint 标签位于看板标题旁边，显示这是一个计划。当未选中任何内容时，面板会说明该计划源自哪个文档、技术栈以及所做的假设。
• Review 取代了 Health。这是对计划的设计评审：任何人都能用来更改数据的端点、没有决定谁可以使用它们的端点、PRD 未解决的问题，以及任何没有连接的部分。每个项目都有 Show on map 和 Resolve on the map，后者会将 Ask 栏切换到 Change，并填写一个请求来解决它。对于未解决的问题，请在“My answer:”后输入你的答案，然后按 Enter。（当地图未提供服务时，按钮会显示为 Resolve with Claude 或 Resolve with Codex，即改为请求粘贴内容。）
• Who may use it： 端点面板会说明是否任何人都可以使用、已登录人员（以及哪些人）、你自己的团队或另一个服务可以使用它。
• Build it： 每个部分和文件都有 Build this with Claude（或 Codex），它会按计划描述的方式显示一个仅构建该部分的请求（其文件、端点、所依赖的内容以及任何未解决的问题），可直接复制到 Claude Code 或 Codex 中。
• Ask and Change： Ask 栏有一个开关。Ask 回答来自计划和 PRD 的问题。Change 接受诸如“同时规划退款”或“删除管理页面”的请求。这需要几分钟；随后地图会重新绘制，新的和更改过的卡片会作为最近工作高亮显示，并有一个摘要提供 Show N changes、Undo 以及建议的下一步更改。

右键菜单¶

Open in editor 会在正确的行号处，在 VS Code（或支持 vscode:// 链接的其他编辑器）中打开该文件。