写 README/技术方案时被 Ai 生成的 PlantUml/Mermaid 折腾烦了,做了个 预览小工具

程图、架构图、时序图和数据结构说明。

比如让它生成:

  • Mermaid flowchart
  • PlantUML sequence diagram
  • OpenAPI 接口调用流程
  • SQL ER 图
  • Docker Compose 服务关系
  • Kubernetes manifest 摘要
  • package.json 依赖关系

问题是,大模型通常只给文本代码。它可以写 Mermaid,但不会稳定地帮你预览;它可以写 PlantUML,但你还要找地方渲染;它可以解释 OpenAPI 或 SQL,但你还是要手动整理成图。

于是我做了 DiagramPreview:

https://diagrampreview.com

下面是 Mermaid 预览和 AI Draw.io 生成页面的效果:

它想解决的是 AI 生成图表后的下一步:

  1. 粘贴 AI 生成的图表代码。
  2. 在线预览是否能渲染。
  3. 如果 Mermaid 语法有问题,可以修复。
  4. 生成 SVG/PNG/PDF,放进 README、技术方案、PRD 或博客。

这个工具站的定位不是替代 AI,而是补上 AI 输出和正式文档之间的"预览、校验、导出"环节。

如果是 DevOps / 监控类文档,也可以用 Grafana Dashboard Generator 生成 JSON 后继续编辑:

适合搜索关键词:

  • Mermaid 在线预览
  • PlantUML 在线预览
  • Mermaid 导出 SVG
  • PlantUML 导出 PNG
  • SQL ER 图在线生成
  • OpenAPI 时序图
  • AI 生成流程图预览
相关推荐
doiito20 小时前
【Agent Harness】Gliding Horse 上下文动态感知与智能压缩:让 Agent 真正“听得进”每一句话
ai·rust·架构设计·系统设计·ai agent
探索云原生2 天前
K8s 1.36 这个 GA 特性,把 initContainer 拉模型的 hack 干掉了
ai·云原生·kubernetes
Zy宇2 天前
从养 OpenClaw 到养社区 AI:一套 Multi-Agent 社区的设计思路
人工智能·ai
doiito2 天前
【Agent Harness】Gliding Horse 记忆系统深度剖析:像 CPU 一样思考的 AI 记忆架构
ai·rust·架构设计·系统设计·ai agent
mobility2 天前
免费AI视频生成器:我如何用零成本做出带旁白字幕的多场景AI视频
ai·vibe coding
doiito3 天前
【Agent Harness】Gliding Horse 给 Agent OS 装上双曲空间引擎与默克尔树边云同步
ai·rust·架构设计·系统设计·ai agent
knqiufan3 天前
从 Python 到 TypeScript,用 GLM-5.2 跑通 PowerMem SDK 的长程任务工程
ai·memory·agentic·powermem
小白跃升坊3 天前
Codex 增强部署:基于 Codex++ 接入 DeepSeek
ai·ai编程·codex·deepseek·ai coding·codex++
AlfredZhao3 天前
GPT 省钱,不是别用最新模型,而是别浪费缓存
gpt·ai
doiito4 天前
【Agent Harness】Gliding Horse 本体论系统设计:给 AI Agent 装上“语义大脑”
ai·rust·架构设计·系统设计·ai agent