一个 TypeScript 库，可将 Mermaid 图表渲染为可主题化的 SVG 或 ASCII/Unicode 文本，无需 DOM 依赖。
1.1万411TypeScriptMIT更新于 6个月前
obsidianmd/pele
一个小型同步渲染器，把 Mermaid 图表文本渲染为 SVG，无运行时依赖。
- Star
- 2,476
- Fork
- 74
- 未关闭 Issue
- 23
- 最近提交
- 14小时前
这是什么？
Pele 把 Mermaid 图表源码渲染为 SVG，语法对齐 Mermaid 12.1.0，并支持该版本内置的全部图表类型。它使用自有的布局与视觉风格，而非 Mermaid 的默认样式。
渲染过程是同步的，且没有运行时依赖。颜色和字体通过 CSS 变量控制，图表可以跟随页面主题，主题切换后无需重新渲染即可更新。在浏览器中，mount 方法会渲染到指定元素，从 CSS 读取字体，并根据容器宽度调整布局。主入口包含全部图表类型，也可以按需注册或懒加载单个类型以减小打包体积。
项目会对图表文本进行转义，过滤链接和样式，并限制输入与输出的大小，同时给出处理不可信图表的建议。它通过 npm 发布，也可以作为全局脚本从 CDN 加载。
核心功能
- 01将 Mermaid 12.1.0 内置的全部图表类型渲染为 SVG。
- 02无运行时依赖，渲染过程为同步执行。
- 03通过 CSS 变量控制颜色和字体，主题变化时自动更新。
- 04提供浏览器端 mount 方法，根据容器宽度自适应布局。
- 05支持按需加载单个图表类型，减小打包体积。
- 06对文本转义，并过滤链接与样式，便于处理不可信输入。
适用场景
- 在网页或文档站点中渲染 Mermaid 图表，且不引入较重的依赖。
- 嵌入需要跟随站点浅色或深色主题的图表。
- 在服务端或构建工具中，把 Mermaid 文本生成为 SVG。
- 只加载页面用到的图表类型，减少 JavaScript 体积。
快速上手
- 1
安装软件包
npm install pele - 2
导入 render 并将 Mermaid 文本转换为 SVG
使用前须知
- README 未明确说明许可证；元数据显示为 NOASSERTION，但 README 提到为 MIT 许可。
- Pele 以 Mermaid 12.1.0 语法为目标，但采用自身的布局和视觉风格，输出可能与 Mermaid 不同。
标签
常见问题
- pele 是什么？
- 一个小型同步渲染器，把 Mermaid 图表文本渲染为 SVG，无运行时依赖。 Pele 把 Mermaid 图表源码渲染为 SVG，语法对齐 Mermaid 12.1.0，并支持该版本内置的全部图表类型。它使用自有的布局与视觉风格，而非 Mermaid 的默认样式。
- pele 可以免费使用吗？用的什么许可证？
- pele 以 Other 许可证开源。用于商业产品前，请先确认许可证条款。
- pele 还在维护吗？
- 活跃维护中。pele 最近一次提交是在 2026年10月19日。
- pele 适合用来做什么？
- 在网页或文档站点中渲染 Mermaid 图表，且不引入较重的依赖。 嵌入需要跟随站点浅色或深色主题的图表。 在服务端或构建工具中，把 Mermaid 文本生成为 SVG。 只加载页面用到的图表类型，减少 JavaScript 体积。
- pele 怎么安装和运行？
- 安装软件包: npm install pele 导入 render 并将 Mermaid 文本转换为 SVG
- 在哪里获取 pele？
- 源代码和安装说明在 GitHub 上：https://github.com/obsidianmd/pele
概要由 AI 根据项目 README 生成；GitHub 数据每日更新。
相关项目
为 Claude 等编程智能体提供的技能，可将简短 JSON 描述转换为可交互、带动画的图表，并导出多种格式。
67138JavaScriptMIT更新于 3天前
一个声明式信息图生成与渲染引擎，通过文本语法输出 SVG 信息图，适合 AI 生成与流式渲染。
7016583TypeScriptMIT更新于 昨天
一个命令行工具，可把纯数字文本渲染成终端图表，支持 ASCII、火花线、柱状图、热力图等多种类型。
80547TypeScript无许可证更新于 7个月前
一个智能体技能，可将图表生成为单个自包含的 HTML + SVG 文件，支持 45 种图表类型和品牌配色匹配。
5.8万3725HTMLMIT更新于 4天前
将 JavaScript 代码转换为 SVG 流程图的库与命令行工具，支持抽象层级、代码块修饰和主题定制。
7105478JavaScriptMIT更新于 3年前