在线 Mermaid 转 SVG 与 PDF——免费浏览器编辑器
Mermaid 用文本描述流程图、时序图等，但交付时常需要导出资源文件。本指南说明如何在不把专有架构图粘贴到托管编辑器的前提下，完成 Mermaid 转 SVG / PDF。
问题场景
文档、RFC 与幻灯片需要 SVG（网页）或 PDF（印刷）。为一次导出安装完整工具链成本高；在线编辑器可能保存源码。你需要可实时预览、并在本地导出的在线 Mermaid 编辑器。
错误示范
- 对半缩放的预览区截图，而不是导出矢量 SVG。
- 仅为导出 PDF 就把机密架构图上传到第三方。
- 默认官方 playground 的所有特性/主题在此完全一致——以本工具实际渲染为准。
- 把本站称为官方 Mermaid 产品——这是独立的浏览器端渲染工具。
正确做法
把 Mermaid 源码当可版本管理的文本，按需导出展示格式：
- 将源码粘贴进浏览器编辑器，对照实时预览修正语法。
- 在可用时选择匹配文档明暗主题的样式。
- 网页嵌入优先下载 SVG；需要固定版式时再用 PDF 导出。
- 草稿保存在本机 localStorage，而不是远程工作区（本工具如此）。
方案差异
| 做法 | 是否上传？ | 导出能力 |
|---|---|---|
| transformer Mermaid 页 | 否 | 浏览器内 SVG + PDF |
| 本地 Mermaid CLI / CI | 否（本地文件） | 可脚本化批量渲染 |
| 托管图表 SaaS | 通常需要 | 协作与云端存储 |
导出检查清单
- 图表可解析（预览无渲染错误）。
- 网页用 SVG、文档包用 PDF——用途选对。
- 敏感标注允许出现在可打印/保存的本机环境。
- 已检查目标场景的主题对比度（文档 vs 深色幻灯片）。
打开 Mermaid 编辑器
实时预览，然后下载 SVG 或 PDF——全程在浏览器中完成。
打开 Mermaid → SVG/PDF 工具transformer 与 Mermaid.js 项目无隶属关系。渲染使用客户端库；图表类型与主题以本站实现为准，不等于官方 playground 的全部能力。