zoukankan      html  css  js  c++  java
  • 使用Markdown语法画流程图

    Markdown流程图

      鉴于本人使用的是马克飞象,所以一下以马克飞象为例:

    语法

      流程图的画法和代码块类似,流程图也是写在两个```之间的。格式用flow表示,例如:

    st=>start: 注册印象笔记
    e=>end: 您可以使用markdown
    op1=>operation: 登录印象笔记
    op2=>operation: 购买并登录马克飞象
    cond=>condition: 是否已经购买并登录了马克飞象?
    
    st->op1->cond
    cond(yes)->e
    cond(no)->op2->e
    

      首先先将所有的元素进行定义,然后将各个元素进行连接
    结果如下:

    流程图的语法大体分为两段:

    • 定义元素
    • 连接元素

    定义元素阶段的语法:
    tag=>type: content:>url
    tag就是一个标签,在第二段连接元素时用type是这个标签的类型

    流程图的基本类型

    • start
    • end
    • operation
    • subroutine
    • condition
    • inputoutput

    开始
    st=>start:开始
    操作流程
    st->op->cond
    条件
    cond=>condition:确认?
    结束
    e=>end:结束

    st[注册印象笔记]-->a
    a{是否已经购买马克飞象}
    a-->|是|b1(您已购买马克飞象可以使用markdown语法)
    a-->|否|b2(您还未能成功购买马克飞象但你可以免费试用10天)
    b1-->c[欢迎使用马克飞象]
    b2-->d{是否要购买马克飞象}
    d-->|是|e1(您已成功购买马克飞象欢迎使用)
    e1-->c
    d-->|否|e2(试用10天后将会到期欢迎购买)
    

    graph:用来确定代码为视图
    -->:用来确定流程图的指向
    []:用来表示矩形
    {}:用来表示菱形
    ||:用来表示判断的是否
    ():用来表示圆角
    表示方式后面输入的解析为真正的显示内容
    结果如下:

  • 相关阅读:
    金融市场的初步了解
    今天参加了一个猎头实践
    前端面试
    web前端 浏览器私有前缀
    背景渐变
    移动web开发之响应式开发
    移动WEB开发之rem适配布局
    flex布局
    常见快捷方式
    virtual
  • 原文地址:https://www.cnblogs.com/Cherry-Linux/p/7797795.html
Copyright © 2011-2022 走看看