AiMermaid 流程图

用于在 AI 回复中渲染 Mermaid 图表（流程图、时序图等），支持图像/代码视图切换与缩放、下载、复制。

基础用法

通过 code 传入 Mermaid 代码，header 可设置标题。

基础流程图

基础用法

多样化图表

AiMermaid 完美支持 Mermaid 的所有语法，包括时序图、甘特图、实体关系图等。

时序图 (Sequence Diagram)

时序图

甘特图 (Gantt Chart)

甘特图

自定义配置

可以通过 config 属性传入 Mermaid 的原生配置，例如修改渲染主题。支持 default, forest, dark, neutral 等预设。

森林模式 (Forest Theme)

自定义主题

操作栏

默认提供缩放、下载、复制；可通过 actions 配置开关。

自定义操作

操作栏

API

Props

属性	说明	类型	默认值
code	Mermaid 代码	string	''
header	顶部标题（字符串或插槽）	string | object	-
config	Mermaid 配置	MermaidConfig	{}
actions	操作栏配置（缩放/下载/复制）	MermaidActions	默认全开
themeOverrides	主题覆盖	Record<string, unknown>	-

Events

事件名	说明
render-type-change	视图类型（image/code）切换时触发
error	渲染错误时触发
ready	渲染就绪时触发