Dhole
Dhole 是一种以文本编写图表和示意图的小型语言。你在第一行写明要画什么,在后续各行说明它展示的内容;Dhole 会负责布局并将其绘制出来。
flowchart Making tea
Thirsty? [start] -> Boil the kettle -> Tea or coffee?
Tea or coffee? -> Steep the tea: tea
Tea or coffee? -> Brew the coffee: coffee
Steep the tea -> Enjoy [end, good]
Brew the coffee -> Enjoy

在交互演示中试一试 —— 在浏览器中编写 Dhole,边输入边查看绘制结果。
以文本编写的示意图写起来快、改起来容易 —— 加一行,图中就会为它腾出位置 —— 而且它本身就可以阅读,无论是在文档、消息还是版本历史中。Dhole 通过 Divooka 的绘图框架进行绘制,因此 Dhole 示意图和其他图表并无二致:它可以在节点上预览,可以应用主题,还可以保存为任意分辨率的图片、SVG、PDF 或 PowerPoint 幻灯片。
它能画什么
| 种类 | 首个单词 | 页面 |
|---|---|---|
| 流程图 | flowchart |
流程图 |
| 时序图 | sequence |
时序图 |
| 状态图 | state |
状态图 |
| 类图 | class |
类图 |
| 实体图 | entity |
实体图 |
| 思维导图和组织结构图 | mindmap |
思维导图 |
| 时间线 | timeline |
时间线 |
| 甘特图 | gantt |
甘特图 |
| 饼图、环形图、条形图、折线图、散点图和雷达图 | pie, donut, bar, line, xy, radar |
图表 |
| 象限图 | quadrant |
象限图 |
| 桑基图 | sankey |
桑基图 |
| 表格和看板 | table, kanban |
表格和看板 |
阅读顺序
- 教程 —— 在 Divooka Compute 中绘制你的第一张示意图,从示例开始,到写出你自己的文本。
- 语言 —— 所有种类共通的内容:第一行、设置、名称、标签、特性、颜色、箭头、缩进、在一段文本中编写多张示意图,以及主题。
- 上面每个种类各自的页面,列出了它接受的所有词。
- 问题 —— 当 Dhole 无法按所写内容读懂文本时会给出什么提示,以及如何修正。
- 示例 —— Divooka Compute 附带的 Dhole 示例。
- Dhole 与 Mermaid —— 写给熟悉 Mermaid 的人:哪些相同、哪些不同,以及原因。
网页上的 Dhole
- 交互演示 —— 编写 Dhole,边输入边查看绘制结果,每个种类都提供一个示例作为起点。
- 在网页上使用 Dhole —— 只需从 CDN 引入一个脚本,即可在任意页面上绘制 Dhole:使用
<dhole-diagram>元素、一次性绘制所有dhole代码块,或通过 JavaScript。它以 MIT 许可证发布在 MethodoxTech/MethodoxDhole 中。
Divooka 中的 Dhole
Plotting 工具箱中有三个节点,由 Data Analytics 工作负载提供:
- Draw Dhole,位于 Dhole 类别中,接受 Dhole 文本并输出图表,同时在其 Problems 输出上将文本中的每个问题作为一行给出。运行之后选中它,即可在 Properties 中查看图片。
- Describe Dhole,位于 Dhole 类别中,接受 Dhole 文本并给出一句话,说明它画的是什么 —— A flowchart of 6 steps and 6 arrows. —— 这正是为看不见图片的人所需的文字说明。
- Write Dhole,位于 Dhole 类别中、Draw Dhole 旁边,把文本保存在节点上。双击它会打开卡片,左侧是文本,右侧是图片,每次修改后稍等片刻即会重新绘制,文本中的任何错误都列在它们下方。

Draw Dhole 输出的图表可以用在任何能用图表的地方:传入 Save Chart 写出 PNG、SVG、PDF 或 Office 文档,传入 Set Theme 重新着色,或放进报告中。
代码中的 Dhole
包名为 Divooka.Visualization.Dhole,语言规范位于其旁边的 Dhole Language.md 中。
using Divooka.Visualization.Dhole;
DholeResult result = Dhole.Read(text); // the figure, every problem, and a sentence of what was drawn
foreach (DholeProblem problem in result.Problems)
Console.WriteLine(problem); // Line 3, column 7: 'lots' is not a number. Write a number with a dot for its decimals, such as 12.5.
result.Figure?.SavePng("diagram.png", 192); // or SaveSvg, SavePdf, SavePptx, ToImage
Figure figure = Dhole.Draw(text); // throws DholeException only when nothing in the text can be drawn
同样的文本在任何机器上总是得到同样的图片:Dhole 中没有任何部分会读取时钟、区域性设置或随机数。
参考资料
- Divooka 中的绘图
- Mermaid,Dhole 曾借鉴于它