描述
DiagramPreview 是一个在线图表预览和转换工作区,面向开发者、产品团队、架构师和技术写作者,他们需要在文档、工单、拉取请求或事件报告中使用图表之前进行检查。它将文本和结构化数据渲染为易于检查、分享和导出的可视化预览,同时保持源代码在预览旁边可见。
阅读更多
该工作区支持多种面向开发者的格式,包括 Mermaid、PlantUML、Markdown、Graphviz、D2、Draw.io XML、思维导图、JSON 和 YAML,并能够在它们之间进行转换,例如将 Mermaid 或 PlantUML 转换为可编辑的 Draw.io XML。它还可视化 JSON Schema、Protobuf、GraphQL、SQL、DBML 和 Prisma 等架构和合同,并将 OpenAPI、Postman 和 HAR 流量转换为后端审查的序列和错误流图。
除了图表外,它还包括一套大型的单用途工具,用于 DevOps 和配置,例如可视化 Docker Compose、Terraform、CloudFormation、Kubernetes 清单、GitHub Actions 和 Helm 值,以及 AI 辅助生成器,可以从自然语言或笔记中创建 Mermaid、PlantUML 和 Draw.io。
大多数渲染在浏览器中本地运行,以保持草稿快速和私密,而 AI 辅助生成器使用服务器端 API,因此提供者密钥不会暴露。支持的渲染器可以从工作区工具栏导出 SVG、PNG 和打印样式的 PDF。
- 类别编程与开发
- 定价模式免费
- 部署云端
- 平台网页版
DiagramPreview的核心功能
实时预览 Mermaid、PlantUML、Graphviz、D2 和 Draw.io 图表
在 Mermaid、PlantUML 和可编辑的 Draw.io XML 之间转换
JSON Schema、SQL、DBML、GraphQL 和 Prisma 的架构可视化
从 OpenAPI、Postman 和 HAR 生成 API 序列和错误流图
用于 Docker、Kubernetes、Terraform 和 GitHub Actions 的 DevOps 配置可视化工具
从自然语言或笔记中 AI 辅助生成图表
优先在浏览器中本地渲染
从工具栏导出为 SVG、PNG 和 PDF
如何使用 DiagramPreview?
选择工具:选择一个预览或转换工具,例如 Mermaid 预览或 Mermaid 转 Draw.io。
粘贴源代码:添加您的图表文本、架构、API 合同或配置。
预览:查看渲染的图表与源代码并修复任何语法问题。
如有需要,转换格式:在 Mermaid 和可编辑的 Draw.io XML 之间移动。
导出:将 SVG、PNG 或 PDF 导入到 README、拉取请求或架构文档中。
DiagramPreview的使用案例
- AI Mermaid 审查
- API 调试
- 架构可视化
- DevOps 配置审查
- 文档准备





