在博客园markdown中使用mermaid

博客后台 -> 设置 -> 页首HTML代码.

添加以下代码:

<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>
<script>mermaid.initialize({startOnLoad:true});</script>

之后就可以愉快的使用mermaid画图了.

例如:

<div class="mermaid">
gantt
	title Gantt Demo
	dateFormat YYYY-MM-DD

	section A
	Start: d1, 2014-01-01, 21d

	section B
	Up: d2, after d1, 31d

	section C
	Down: d3, after d2, 11d

        section D
        Complete: d4, after d3, 16d
</div>

结果如下

gantt title Gantt Demo dateFormat YYYY-MM-DD section A Start: d1, 2014-01-01, 21d section B Up: d2, after d1, 31d section C Down: d3, after d2, 11d section D Complete: d4, after d3, 16d

备注: 在写作过程中博客园实时预览md不会渲染mermaid, 博文发布以后页面会正常显示.

标签：markdown,博客园,after,d3,01,d2,section,mermaid,d1
来源： https://www.cnblogs.com/code-LX/p/15869607.html