文档

https://mermaidjs.github.io/#/

cdn

https://www.bootcdn.cn/mermaid/

在线编辑

https://mermaidjs.github.io/mermaid-live-editor/#/edit/eyJjb2RlIjoiZ3JhcGggVERcbkFbQ2hyaXN0bWFzXSAtLT58R2V0IG1vbmV5fCBCKEdvIHNob3BwaW5nKVxuQiAtLT4gQ3tMZXQgbWUgdGhpbmt9XG5DIC0tPnxPbmV8IERbTGFwdG9wXVxuQyAtLT58VHdvfCBFW2lQaG9uZV1cbkMgLS0-fFRocmVlfCBGW2ZhOmZhLWNhciBDYXJdXG4iLCJtZXJtYWlkIjp7InRoZW1lIjoiZGVmYXVsdCJ9fQ

集成

已经集成到markdown编辑器Typora上

可以和hugo集成

使用示例

https://zhuanlan.zhihu.com/p/70261692

工具Typora

目前mac属于beta版本，免费 https://www.typora.io/

主题下载

画图前端：mermaid。时序图/类图/甘特图/流程图/状态图/饼图。类似工具:Typora的更多相关文章

  1. 在博客文章中使用mermaid 定义流程图，序列图，甘特图

    概述 Mermaid(美人鱼)是一套markdown语法规范,用来在markdown文档中定义图形,包括流程图.序列图.甘特图等等. 它的官方网站是 https://mermaid-js.github ...

  2. java处理jqueryGantt甘特图数据的task.depends依赖规则方法

    前端采用jqueryGantt,github地址为:https://github.com/robicch/jQueryGantt 原以为后端只需要简单地保存甘特图任务列表和返回任务列表就行了. 但功能 ...

  3. 甘特图和PERT图

    gantt图又叫甘特图.进度是按时间顺序计划活动的一个列表,我们称之为Gantt图,它有以下几个关键的成分:1.横跨图顶部排列的是日历表.2.最左边的一列包含了每项任务的标识号(ID).3.左边第二列 ...

  4. WBS 与 甘特图

    WBS:工作分解结构(Work Breakdown Structure) 创建WBS:创建WBS是把项目 交付成果和项目工作分解成较小的,更易于管理的组成部分的过程. WBS是项目管理重要的专业术语之 ...

  5. Python使用Plotly绘图工具，绘制甘特图

    今天来讲一下如何使用Python 的绘图工具Plotly来绘制甘特图的方法 甘特图大家应该了解熟悉,就是通过条形来显示项目的进度.时间安排等相关情况的. 我们今天来学习一下,如何使用ployly来绘制 ...

  6. 甘特图——Excel搞定

    1. 甘特图 概念 甘特图就是条形图的一种. 甘特图是基于作业排序的目的,将活动与时间联系起来的最早尝试之中的一个. 这是什么意思呢?也就是说甘特图用来表示什么时间做什么事情,相当于一个计划安排.并且 ...

  7. Mermaid js与流程图、甘特图..

    https://mermaidjs.github.io/gantt.html https://github.com/jdbranham/grafana-diagram 用 mermaid 画甘特图 h ...

  8. eclipse下生成Java类图和时序图，生成UML图

    1.安装和使用AmaterasUML 安装AmaterasUML前,需要先安装GEF采用eclipse在线安装方式安装就好.eclipse在线安装GEF的地址:http://download.ecli ...

  9. 轻松理解UML用例图时序图类图的教程

    摘自https://zhuanlan.zhihu.com/p/29874146 写在前面 当你老大扔给你这样的图,或者你需要完成某些功能而去看文档的时候发现以下类似这样的图会不会不(一)知(脸)所(懵 ...

随机推荐

  1. python学习类与方法的调用规则

    1类方法的特点是类方法不属于任何该类的对象,只属于类本身 2类的静态方法类似于全局函数,因为静态方法既没有实例方法的self参数也没有类方法的cls参数,谁都可以调用 3.实例方法只属于实例,是实例化 ...

  2. ML.NET学习笔记 ---- 系列文章

    机器学习框架ML.NET学习笔记[1]基本概念与系列文章目录 机器学习框架ML.NET学习笔记[2]入门之二元分类 机器学习框架ML.NET学习笔记[3]文本特征分析 机器学习框架ML.NET学习笔记 ...

  3. CORS 跨域 node |XMLHttpRequest 跨域提交数据 node

    node服务端 app.post('/getdata',function(req,res,next){ req.setEncoding('utf8'); res.setHeader('Access-C ...

  4. HTML 009 select_jquery操作下拉框select

    取值问题 <select id="selector"> <option value="1">选项一</option> < ...

  5. LOJ P10011 愤怒的牛 题解

    每日一题 day36 打卡 Analysis 非常水的二分模板,就直接二分答案,用贪心策略check就好了 #include<iostream> #include<cstdio> ...

  6. puppeteer 试用

    puppeteer 是chrome 团队提供的Headless chrome node api 库,我们可以用来方便的进行chrome 操作,同时 可以做好多事情(web 爬虫,生成pdf,截图... ...

  7. centos 较新版本kernel安装方法

    有时因为系统内核的bug 我们必须要安装新版本的kernel 来解决问题,有几种方法 源码编译 使用编译好的包 使用包的方式比较方便,同时一些依赖的问题可以自动帮助我们处理 添加yum 源 rpm - ...

  8. vue-element-admin 实现动态路由(从后台查询出菜单列表绑定)

    1. 在路由实例中保留基础路由 router/index.js中只需要保留基础路由,其他的都删了 2. 获取用户菜单,并保存到Vuex中 stroe/modules/user.js中,有个getInf ...

  9. PHP strtok() 函数

    我们仅在第一次调用 strtok() 函数时使用了 string 参数.在首次调用后,该函数仅需要 split 参数,这是因为它清楚自己在当前字符串中所在的位置. 如需分割一个新的字符串,请再次调用带 ...

  10. PHP 之循环创建文件夹

    /** * 循环创建文件夹 * @param string $dir 需要创建的文件夹路径 * @param integer $mode 文件夹权限 * @return bool 返回创建是否成功 * ...