Typograms ASCII 图表组件使用指南

本文介绍如何在博客中使用 Typograms 组件创建 ASCII 艺术图表。

流程图

分支流程

简单框图

箭头示意

使用方式

import { Typograms } from '@/components/mdx';

<Typograms>
{`
+--------+     +--------+
| 开始   | --> | 结束   |
+--------+     +--------+
`}
</Typograms>

绘图语法

• + 角落连接点
• - 水平线
• | 垂直线
• >, <, ^, v 箭头方向
• 文字直接写在框内