回答

想把一篇长文一键变成“一目了然”的图（流程图、思维导图、时序图、图表）？

核心思路是：先抽取结构，再生成可渲染的“图语言”（Mermaid/PlantUML/Graphviz/Vega-Lite/ECharts），最后导出为图片。下面给你一套可直接复制用的模板提示词 + 工具与流程。

一、先选图类型（按用途选）

结构梳理：思维导图（mindmap）

步骤与分支：流程图（flowchart）或 BPMN

参与者+时间顺序：时序图（sequence）

概念关联/因果：概念图（概念-关系-概念，或 labeled flowchart）

事件时间轴：timeline 或 gantt

数据指标：柱状/折线/饼图（Vega-Lite、ECharts）

二、通用两步法（强烈建议）1) 抽取结构（让模型先产出“中间结构”，如节点表、关系表、层级大纲）2) 生成图代码（Mermaid/PlantUML/Graphviz 或图表 JSON 规范）这样可控、可审、可重用。

三、通用提示词（可套到任意图）复制后把【你的文章】替换为正文，把“目标图类型”替换为 mermaid/plantuml/vega-lite 等。

步骤A：抽取结构

你是信息架构师与可视化专家。请对以下文章进行结构化抽取：
- 输出1：关键实体/节点表（id、名称、类型、出现位置、重要度1-5）
- 输出2：关系表（source_id、target_id、关系/动作、证据片段）
- 输出3：层级大纲（最多3级，节点≤20）
- 约束：去重同义词，保留时间顺序和条件分支；若信息不足，列出需要澄清的3个问题
文章：
【你的文章】

步骤B：生成图代码

基于上述结构，请生成【目标图类型】代码，并满足：
- 只输出一个代码块，语法严格可渲染
- 节点≤20、合理分组上色、中文标签，不要重复节点
- 若是流程：显式条件分支（是/否）；若是关系图：边须带关系词
- 若是图表：先给数据表，再给配置（仅必要字段）

四、按图种给你现成模板

1) Mermaid 流程图（流程/条件最清晰）提示词：

请把文章转为 Mermaid 流程图（flowchart TD）：
- 使用判定菱形表示分支
- 分组使用subgraph，每组不超过6个节点
- 标注关键路径为粗线
- 限制节点≤18
- 只输出代码块
文章：
【你的文章】

示例输出（可直接渲染）：

flowchart TD
  A[用户访问] --> B{是否已登录?}
  B -- 是 --> C[进入首页]
  B -- 否 --> D[跳转登录页]
  D --> E[提交账号密码]
  E -->|成功| C
  E -->|失败| D
  subgraph 订单
    C --> F[选择商品]
    F --> G[下单]
    G --> H{支付成功?}
    H -- 是 --> I[发货]
    H -- 否 --> J[提示重试]
  end
  classDef key stroke-width:3px,stroke:#222;
  C:::key; G:::key; H:::key; I:::key;

2) Mermaid 思维导图（结构总览）

请将文章要点转为 Mermaid mindmap，要求：
- 3层结构，根节点为文章主题
- 每个二级节点≤6个三级子项
- 重要项前加✅，风险项前加⚠️
- 只输出代码块
文章：
【你的文章】

示例：

mindmap
  (某主题)
    核心观点
      ✅ 观点A
      观点B
    证据
      数据
      案例
    方法
      步骤1
      步骤2
    风险
      ⚠️ 约束1
      ⚠️ 依赖2

3) Mermaid 时序图（多参与者/时间顺序）

将文中交互过程转为 Mermaid 时序图：
- 定义参与者：用户、前端、后端、支付、物流（如有）
- 标注异步/同步调用、超时与重试
- 只输出代码块
文章：
【你的文章】

示例：

sequenceDiagram
  participant U as 用户
  participant FE as 前端
  participant BE as 后端
  U->>FE: 提交下单请求
  FE->>BE: 创建订单
  BE-->>FE: 订单ID
  FE->>U: 显示支付二维码
  U->>BE: 支付回调
  BE-->>U: 支付成功

4) 概念/因果关系图（带边标签）

请输出带边标签的 Mermaid 流程图，用于概念/因果：
- 格式：A --|关系|--> B
- 合并同义词；按原因→结果布局（LR）
- 最多15个节点
文章：
【你的文章】

示例：

flowchart LR
  A[营销预算] --|提升|--> B[曝光]
  B --|带来|--> C[点击]
  C --|转化为|--> D[订单]
  E[站点性能差] --|抑制|--> C

5) 时间轴/项目计划（Mermaid timeline/gantt）时间轴：

将关键事件转为 Mermaid timeline：
- 用年份/日期分段
- 事件≤12条
文章：
【你的文章】

示例：

timeline
  2023
    Q1: 立项
    Q2: MVP
  2024
    01: 公测
    06: 正式发布

Gantt：

请输出项目甘特图（Mermaid gantt），含里程碑和依赖：
- 日期用YYYY-MM-DD
- 任务≤12
文章：
【你的文章】

6) 数据图表（Vega-Lite 或 ECharts）两步提示词：

从文章中提取所有定量信息，统一单位并输出数据表：
- 字段：指标、数值、单位、时间/分组、来源片段
- 丢弃不确定或区间模糊的值
文章：
【你的文章】

然后：

根据数据表，生成 ECharts 配置（option）：
- 若为时序：折线图；若为对比：分组柱
- 仅输出JSON，不要多余解释
- 中英文label一致用中文
- 若数据不足，返回建议的图表类型和缺失字段

ECharts 示例：

{
  "tooltip": {"trigger": "axis"},
  "legend": {"data": ["转化率"]},
  "xAxis": {"type": "category", "data": ["1月","2月","3月"]},
  "yAxis": {"type": "value", "axisLabel": {"formatter": "{value}%"}},
  "series": [
    {"name": "转化率", "type": "line", "data": [2.1, 3.5, 4.2], "smooth": true}
  ]
}

五、把代码变成图片的几种方式

在线渲染

Mermaid Live Editor / Mermaid Chart

Kroki（统一渲染 mermaid/plantuml/graphviz）：可POST文本返回PNG/SVG

PlantUML Server（即贴即渲）

本地/IDE

VSCode + Mermaid/PlantUML 插件

Obsidian/Notion/Typora 支持 Mermaid 预览

Node + mermaid-cli：mmdc -i in.mmd -o out.svg

白板/图形化

draw.io（diagrams.net）可导入/粘贴 Mermaid/PlantUML

Whimsical/ tldraw/ Miro（部分支持AI生成草图）

思维导图

XMind、MindNode、飞书文档思维笔记、Notion AI（可直接生成/导入）

六、自动化一条龙（可选）

Python 批处理思路：1) 用 LLM 抽取结构 → 存 JSON（nodes/edges）2) 生成 Mermaid 文本3) 用 mermaid-cli 批量转 SVG/PNG

伪代码流程：

extract_json = llm(prompt_extract + article)
mermaid_code = llm(prompt_mermaid + extract_json)
save('diagram.mmd', mermaid_code)
!mmdc -i diagram.mmd -o diagram.svg

七、质量控制清单

节点≤20，单图不贪多；复杂文章拆多图

边带明确关系词（因、果、促进、抑制、依赖、输入/输出）

去重同义词（如“下单/提交订单”）

关键路径加粗或单独上色

时间/因果/层级维度不要混在一张图里

导出后，请人工核对2个问题：是否遗漏关键环节？有无误导性边？

八、给你一个“多图合一”的一次性提示词

你是可视化顾问。请把这篇文章转为三种图，并各输出一个代码块：
1) 思维导图（Mermaid mindmap）：3层，节点≤20
2) 流程图（Mermaid flowchart TD）：含条件分支、关键路径加粗
3) 时间轴（Mermaid timeline）：事件≤12
若信息不足，请在最上方给出需补充的问题清单（最多3条）。
文章：
【你的文章】

九、实战小例子（迷你）输入片段：

用户访问首页，若未登录跳转登录；登录成功进入首页

选择商品→下单→支付，支付失败可重试

订单成功后发货

生成流程图：

flowchart TD
  A[首页] --> B{已登录?}
  B -- 否 --> C[登录页]
  C --> D[提交登录]
  D -->|成功| E[首页]
  D -->|失败| C
  B -- 是 --> E
  E --> F[选择商品]
  F --> G[下单]
  G --> H{支付成功?}
  H -- 是 --> I[发货]
  H -- 否 --> J[重试支付]
  J --> H

十、哪些模型/工具更顺手

能直接产出 Mermaid/PlantUML 的通用大模型：GPT-4/4o、Claude、Gemini

图表：输出 Vega-Lite 或 ECharts JSON 后本地渲染

一键类：Whimsical AI（文字→流程图/思维导图），Miro AI，Notion AI（大纲/导图）