安装最新的vscode编辑器,原生支持markdown语法。不会markdow的人可以去好好学下,写文档神器!!!

1、安装Markdown Preview Enhanced插件

2、本地新建test.md文件
输入:

```flow
st=>start: 页面加载
e=>end: End:>http://www.google.com
op1=>operation: get_hotel_ids|past
op2=>operation: get_proxy|current
sub1=>subroutine: get_proxy|current
op3=>operation: save_comment|current
op4=>operation: set_sentiment|current
op5=>operation: set_record|current

cond1=>condition: ids_remain空?
cond2=>condition: proxy_list空?
cond3=>condition: ids_got空?
cond4=>condition: 爬取成功??
cond5=>condition: ids_remain空?

io1=>inputoutput: ids-remain
io2=>inputoutput: proxy_list
io3=>inputoutput: ids-got

st->op1(right)->io1->cond1
cond1(yes)->sub1->io2->cond2
cond2(no)->op3
cond2(yes)->sub1
cond1(no)->op3->cond4
cond4(yes)->io3->cond3
cond4(no)->io1
cond3(no)->op4
cond3(yes, right)->cond5
cond5(yes)->op5
cond5(no)->cond3
op5->e

```

3、右键实时预览效果

就会看到下面的预览效果:

编辑器右键还可以将流程图存为html,图片,用浏览器打开等!

欢迎大家试用! 写好文档也是一项必备技能呦!

VS Code实现markdown画流程图的更多相关文章

  1. 使用mermain用Markdown的语法画流程图和UML图

    博客搬到了fresky.github.io - Dawei XU,请各位看官挪步.最新的一篇是:使用mermain用Markdown的语法画流程图和UML图.

  2. 使用 Markdown Flow 画流程图

    使用 Markdown Flow 画流程图 好处是可以方便的使用 Git 管理版本 st=>start: 开始 e=>end: 结束 c1=>condition: A c2=> ...

  3. MarkDown和流程图诠释你的代码

    写在前面:首先感谢导师-猴哥对我的认可(求多分享点编程经验.工具.多开课),学习编程是一个痛苦和快乐的过程,希望大家共勉 本文介绍MarkDown的基本语法.使用MarkDown画简单的流程图.使用X ...

  4. markdown的流程图实现和代码语法着色

    用flowchart为markdown添加流程图 举个例子如下,根据这个例子大家就能看懂我到底是怎么实现的 <!DOCTYPE html> <html> <head> ...

  5. 使用vs code编写Markdown文档以及markdown语法详解

    首先安装vscode工具,下载地址如下: https://code.visualstudio.com/ 在vs code的扩展中安装: Markdown Preview Enhanced 这款插件,安 ...

  6. [6278009]使用Visual Stuido Code 编写Markdown

    使用Visual Stuido Code 编写Markdown void main() { printf("Hello world!"); } void main() { Cons ...

  7. canvas画流程图

    用canvas画流程图: 需求:最后一个圆圈无直线 遇到问题:需要画多个圆圈时,画布超出显示屏加滚动条,解决方法是<canvas>外层<div>的width=100%,且ove ...

  8. activiti在线画流程图

    springboot2.2 activiti6.0 activiti-modeler 5.22.0 注明:版本不一样会导致报错 上一篇:springboot整合activiti 效果图 代码分享:ht ...

  9. flowable+tomcat部署flowable项目,在线画流程图

    参考: flowable+tomcat部署flowable项目,在线画流程图

随机推荐

  1. django-URL反向解析Reverse(九)

    解决path中带参数的路径. reverse(viewname,urlconf=None,args=None,Kwargs=None,current_app=None) book/views.py f ...

  2. java script三大组成部分

    JavaScript是一种属于网络的脚本语言,已经被广泛用于Web应用开发,常用来为网页添加各式各样的动态功能,为用户提供更流畅美观的浏览效果.通常JavaScript脚本是通过嵌入在HTML中来实现 ...

  3. 代码作家Alpha冲刺阶段博客目录

    一.Scrum Meeting 1. [第六周会议记录] 2. [第七周会议记录] 二.测试报告 Alpha阶段测试报告 三.习得的软工原理/方法/技能  1. 在项目前期准备中,我们学会了一些页面设 ...

  4. Application,Session,Cookie,ViewState,Cache对象用法、作用域的区别

    1.Application:用于保存所有用户共用的数据信息.在Asp.Net中类似的配置数据最好保存在Web.config文件中.如果使用Application对象,一个需要考虑的问题是任何写操作都要 ...

  5. C和C++中的引用传递

    两种引用传递的定义方式 第一种 #include<stdio.h> void changeValue(int *a); int main(){ int a =1; changeValue( ...

  6. 一篇文章让你彻底理解java中抽象类和接口

    目录 1.我所理解的抽象类 2.我所理解的接口 3.抽象类和接口本质区别 相信大家都有这种感觉:抽象类与接口这两者有太多相似的地方,又有太多不同的地方.往往这二者可以让初学者摸不着头脑,无论是在实际编 ...

  7. ProvisionedAppxPackage VS AppxPackage

    正文 先来说说问题的由来. 在 Preinstall 的 component 中,有一支 component 叫做 MS_StartApp,这个 component 的行为是在预安装时为目标机器装入一 ...

  8. Spring Boot 如何给微信公众号返回消息

    hello 各位小伙伴,今天我们来继续学习如何通过 Spring Boot 开发微信公众号.还没阅读过上篇文章的小伙伴建议先看看上文,有助于理解本文: Spring Boot 开发微信公众号后台 上篇 ...

  9. Spring Cloud gateway 三 自定义过滤器GatewayFilter

    之前zuul 网关介绍.他有过滤器周期是四种,也是四种类型的过滤器.而gateway 只有俩种过滤器:"pre" 和 "post". PRE: 这种过滤器在请求 ...

  10. 硬件内存模型到 Java 内存模型,这些硬核知识你知多少?

    Java 内存模型跟上一篇 JVM 内存结构很像,我经常会把他们搞混,但其实它们不是一回事,而且相差还很大的,希望你没它们搞混,特别是在面试的时候,搞混了的话就会答非所问,影响你的面试成绩,当然也许你 ...