mermaid使用简介(画论文插图的一种解决方案)
官方IO:
https://mermaid-js.github.io/mermaid/#/
官方对mermaid的简介是这样的:Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.
Markdown风格的语法,用于生成流程图,序列图,类图,甘特图和git图。
接触mermaid(直译:美人鱼)是因为渐渐的要写一些小论文之类的东西,为了让论文里的概念更加直白就当然需要插图啦。但是直到现在我都没弄明白用啥来画这些论文里的插图比较好。一次偶然的机会,点开了博客园邻居CSDN的编辑器,发现它的编辑器有一类文法,叫mermaid。看了效果之后心想这不就是我需要的嘛,可以画各种流程图,时序图。需要注意的是,mermaid是一种文法,所以具有高度的可移植性。它不会主动生成你所需要的图片,想把mermaid(一行行带各种tag的代码)变成自己需要的东西(README文件,论文小插图),则需要解释器。这种解释器大部分时候其实就是编辑器啦,比如隔壁的哪一家编辑器。
下面简单介绍一下mermaid的最基础用法,想用的更溜,建议还是点到官方IO里去钻研文档:(代码前后的```mermaid)是告诉编辑器这是mermaid文法,需灵活看待。
1.Flowcharts(流程图)
```mermaid
graph LR;
A --> B
B --> C
C --插入文字--> A
```

箭头、方格、文字style均可改,文档中可查。是不是很方便呢?不用为了对齐箭头方格而头疼了吧?
2.SequenceDiagram(时序图)
```mermaid
sequenceDiagram
Alice->John: Hello John, how are you?
loop Every minute
John-->Alice: Great!
end
```

是在通信中很常用的图。
饼图,状态图也都可以用mermaid轻松作出来,详细的使用方法不再赘述,文档可速查。但是mermaid的目标可能还并不是生成生成高质量的演示图片。我认为它还是更适合进行演示而不是放到正式论文里,但是作一些小图还是可以滴。
mermaid使用简介(画论文插图的一种解决方案)的更多相关文章
- 简介C#读取XML的两种方式
简介C#读取XML的两种方式 作者: 字体:[增加 减小] 类型:转载 时间:2013-03-03 在程序中访问进而操作XML文件一般有两种模型,分别是使用DOM(文档对象模型)和流模型,使用DOM的 ...
- echars画折线图的一种数据处理方式
echars画折线图的一种数据处理方式 <!DOCTYPE html> <html> <head> <meta charset="utf-8&quo ...
- 像画笔一样慢慢画出Path的三种方法(补充第四种)
今天大家在群里大家非常热闹的讨论像画笔一样慢慢画出Path的这种效果该如何实现. 北京-LGL 博客号@ligl007发起了这个话题.然后各路高手踊跃发表意见.最后雷叔 上海-雷蒙 博客号@雷蒙之星 ...
- 今天我们要说的画一个三角形,恩,画一个三角形,第一种呢是利用我们的html标签结合css来实现;而第二种方法就就是我们的html5新增的一个标签canves,这个canves就是网页画幕,那么顾名思义就是在网页里建造一个画板,用来画画,好,那接下来就和我一起去看看吧!
第一种方法:利用我们的html标签结合css来实现 span{ width:0px; height:0px; border-width:7px; border-style:solid; border- ...
- 第一节:EF Core简介和CodeFirst和DBFirst两种映射模式(以SQLite和SQLServer为例)
一. EF简介 1. 定义 Entity Framework (EF) Core 是轻量化.可扩展.开源和跨平台的数据访问技术,它还是一种对象关系映射器(ORM),它使.NET 开发人员能够使用面向对 ...
- 在android中画圆形图片的几种办法
在开发中常常会有一些需求,比方显示头像,显示一些特殊的需求,将图片显示成圆角或者圆形或者其它的一些形状. 可是往往我们手上的图片或者从server获取到的图片都是方形的.这时候就须要我们自己进行处理, ...
- iOS 画圆图片的几种方法
方法一: self.cycleImv= [[UIImageView alloc]initWithFrame:CGRectMake(100, 100, 50, 50)]; [self.view addS ...
- 留学英文论文写作Abstract三种类型
所谓Abstract,就是对所写论文主要内容的精炼概括.Abstract是美国人的说法,英国的科技期刊喜欢称之为Summary.在英文中,有资料是这么对其定义的:Abstract is a sketc ...
- python 正则表达式 贪婪模式的简介和匹配时的几种模式
看到一篇文章,关于python正则的,http://www.cnblogs.com/huxi/archive/2010/07/04/1771073.html 贪婪模式与非贪婪模式: 正则表达式通常用于 ...
随机推荐
- 【python爬虫】scrapy实战1--百万微博任性采集
原文: https://blog.csdn.net/qq_36936730/article/details/105132550
- 【pyecharts】地图显示不全
官网给的解释如下: 自从 0.3.2 开始,为了缩减项目本身的体积以及维持 pyecharts 项目的轻量化运行,pyecharts 将不再自带地图 js 文件. 如用户需要用到地图图表,可自行安装对 ...
- [JavaWeb基础] 003.JAVA访问Mysql数据库
上面两篇讲解了简单的JSP + Servlet的搭建和请求,那么后面我们肯定要用到数据交互,也就是操纵数据库的数据,包括对数字的增加,删除,修改,查询.我们就用简单的MySql来做例子 我们需要引入驱 ...
- 关于同一密码使用generate_password_hash生成不同的密码散列值
在python的 werkzeug.security 库中有两个函数generate_password_hash与check_password_hash用于对密码明文生成散列值以及检查密码是否与提供的 ...
- MyBatis主配置文件
MyBatis的使用非常简单,使用流程整体可以分成以下四步: public class UserDaoTest { private SqlSessionFactory sqlSessionFactor ...
- 副业收入是我做程序媛的3倍,工作外的B面人生
到“程序员”,多数人脑海里首先想到的大约是:为人木讷.薪水超高.工作枯燥…… 然而,当离开工作岗位,撕去层层标签,脱下“程序员”这身外套,有的人生动又有趣,马上展现出了完全不同的A/B面人生! 不论是 ...
- Rocket - util - ReduceOthers
https://mp.weixin.qq.com/s/gbR5fuDbE_nUFVxw-p4rsA 简单介绍ReduceOthers的实现. 1. 基本介绍 输入一组Bool元素 ...
- Mysql查询语句,select,inner/left/right join on,group by.....[例题及答案]
创建如下表格,命名为stu_info, course_i, score_table. 题目: 有如图所示的三张表结构,学生信息表(stu_info),课程信息表(course_i),分数信息表(sco ...
- Java实现 蓝桥杯 算法训练 多阶乘计算
试题 算法训练 多阶乘计算 问题描述 我们知道,阶乘n!表示n*(n-1)(n-2)-21, 类似的,可以定义多阶乘计算,例如:5!!=531,依次可以有n!..!(k个'!',可以简单表示为n(k) ...
- Java实现 LeetCode 676 实现一个魔法字典(暴力)
676. 实现一个魔法字典 实现一个带有buildDict, 以及 search方法的魔法字典. 对于buildDict方法,你将被给定一串不重复的单词来构建一个字典. 对于search方法,你将被给 ...