浏览文档

短代码

使用短代码生成 Kroki 图表。

语法

闭合语法

1{{< kroki _type=[type] >}}
2DIAGRAM
3{{< /kroki >}}

其与代码块用法相似。

自闭合语法

1{{< kroki _type=[type] _name=[name] />}}

参数

_name

索引名称类型必填默认值版本示例
-_namestring----

图表文件名称,支持站点资源和页面资源。

_type

索引名称类型必填默认值版本示例
-_typestring---

图表类型,比如:blockdiagbpmnbytefieldseqdiagactdiagnwdiagpacketdiagrackdiagc4plantumld2dbmlditaaerdexcalidrawgraphvizmermaidnomnomlpikchrplantumlstructurizrsvgbobsymbolatortikzvegavegalitewavedromwireviz

_output

索引名称类型必填默认值版本示例
-_outputstring-inline--

输出的类型:inlineembed

其他

你可以为图表设置任意属性,比如 idclassdata-* 等等。

示例

站点文件 Kroki 示例

1digraph G {Hello->World}
源码
1{{< kroki _type="graphviz" _name="diagrams/hello.dot" >}}
结果
GHelloHelloWorldWorldHello->World

页面文件 Kroki 示例

1graph TD
2  A[ Anyone ] -->|Can help | B( Go to github.com/yuzutech/kroki )
3  B --> C{ How to contribute? }
4  C --> D[ Reporting bugs ]
5  C --> E[ Sharing ideas ]
6  C --> F[ Advocating ]
源码
1{{< kroki _type="mermaid" _name="diagrams/mermaid.dot" >}}
结果

Can help

Anyone

Go to github.com/yuzutech/kroki

How to contribute?

Reporting bugs

Sharing ideas

Advocating