绘图工具mermaid

mermaid是一个基于Javascript的图表工具，简而言之就是能用它来画甘特图啊，流程图什么的，用代码的方式，和markdown类似。之前绘制流程图用的是在线绘图，甘特图用的是GanttProject，然后发现了mermaid，用它大概能搞定流程图、时序图、类图、状态图、关系图、甘特图、饼图等，所以之后估计都会使用它来绘图啦，最关键的是，它！开源！免费！
之后会用到啥更新啥~

1 相关链接

直接通过这些链接就完全能够了解并使用啦
代码仓库
说明文档
VsCode插件Mermaid Editor，相关插件特别多，这个是比较独立的，所以用来作为示例
在线编辑器仓库

2 使用

2.1 浏览器

最最最方便的就是直接用浏览器，可以直接用别人搭好的beta，也可以用上面链接中的在线编辑仓库自己搭建一个。

2.2 vscode插件

商店里面搜索Mermaid，安装插件Mermaid Editor，之后建立个文件.mmd，输入

graph LR;  
　　A-->B;    
　　A-->C;  
　　B-->D;  
　　C-->D;

点击右上角的眼睛，则可以渲染出图像。

当然也能在markdown中直接画，例如安装Markdown Preview Enhanced这个插件，然后代码改为

```mermaid
graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;
```

2.3 其他

更多就见文档，简而言之就是基本哪里都能用。

3 语法

这里仅仅会记录我使用到的部分，更多请自行参考说明文档

3.1 甘特图

```mermaid 
gantt
    %% 显示在整个甘特图顶部位置的标题
    title 甘特图标题
    %% 时间的格式
    dateFormat  YY-MM-DD
    %% 在轴上显示的格式
    axisFormat  %Y/%m/%d
    %% 设置当前时间标识
    todayMarker stroke-width:5px,stroke:#0,opacity:0.5
    %% 工作时间算上周末
     %% (`excludes` accepts specific dates in YYYY-MM-DD format, days of the week ("sunday") or "weekends", but not the word "weekdays".)
    excludes   weekends
    %% 分类
    section 研发
    %%任务名称 : 任务状态(已完成)，任务特征值，开始时间，时长
     A task           :done,a1, 21-09-01, 10d
    %%任务名称 : 任务状态(正在进行)，任务特征值，在a1任务完成后开始，时长
     B task           :active,a2, atert a1,10d
    
    section 测试
    %%任务名称 : 任务状态(关键任务)，任务特征值，开始时间，结束时间
     A task           :crit,a3,21-09-01,21-09-30
```

生成图像：