阳光肺科

 找回密码
 立即注册

微信扫码登录

搜索

[Flow] 标准流程图(flow)

 火.. [复制链接]
南国风 发表于 2024-7-23 15:23:31 | 显示全部楼层 |阅读模式

马上注册,阅读更多内容,享用更多功能!

您需要 登录 才可以下载或查看,没有账号?立即注册

×
Markdown:流程图
请注意,如果不是标准化代码,则无是去显示预览。
flow 是标准流程图。mermaid是样式流程图,不一样的,不可以通用。

本插件集成flowchart.js至DiscuzX论坛

使用方法


插件不提供编辑器按钮,请直接使用标签 `[flow][/flow]`
例如:
[flow]
st=>start: Start:>http://www.google.com[blank]
e=>end:>http://www.google.com
op1=>operation: My Operation
sub1=>subroutine: My Subroutine
cond=>condition: Yes
or No?:>http://www.google.com
io=>inputoutput: catch something...

st->op1->cond
cond(yes)->io->e
cond(no)->sub1(right)->op1[/flow]

使用方法


[flow]st=>start: Start:>http://www.google.com[blank]
e=>end:>http://www.google.com
op1=>operation: My Operation
sub1=>subroutine: My Subroutine
cond=>condition: Yes
or No?:>http://www.google.com
io=>inputoutput: catch something...

st->op1->cond
cond(yes)->io->e
cond(no)->sub1(right)->op1[/flow]
---------------------------------------------------------------------------
[flow]
op1=>operation: 我的操作1
op2=>operation: 我的操作2
op3=>operation: 我的操作3
op1->op2->op3
[/flow]



[flow]

st=>start: 用户登陆
op=>operation: 登陆操作
cond=>condition: 登陆成功 Yes or No?
e=>end: 进入后台

st->op->cond
cond(yes)->e
cond(no)->op
[/flow]



st=>start: 用户登陆
op=>operation: 登陆操作
cond=>condition: 登陆成功 Yes or No?
e=>end: 进入后台

st->o->cond
cond(yes)->e
cond(no)->op
阳光网络 发表于 2024-8-6 09:52:14 | 显示全部楼层
MarkDown流程图全指导
by Zoomla!逐浪CMS发哥 2020-09-11 18:03:32
准备工作
Markdown是一个轻量级的标记语言,使用普通文本编辑器就能快速编写,不仅显示格式丰富,功能也毫不含糊,分享一个md格式的API请求流程图。
在使用Markdown图表前,你首先需要有解析工具,在本地开发,用vs code再加Markdown preview插件,显然是可以胜任。
由于有些浏览器渲染不出来,所以少数样式流程图带用了图片插入,在强解析下会呈现出相同的两个效果。
基本原理
Markdown图表支持类型包括:
  • 流程图:指定 mermaid(样式流程图) 或 flow (标准流程图)解析语言
  • 时序图:指定 sequence(标准时序图) 或 mermaid(样式时序图) 解析语言
  • 甘特图:指定 mermaid 解析语言
这些复杂图形的绘制都是使用代码块实现的,指定代码块的解析语言,按照响应的绘制语法即可实现。
一、流程图
详解标准流程图
基本语法:
  • 定义模块 id=>关键字: 描述 (“描述”的前面必须有空格,“=>” 两端不能有空格)
  • 关键字:

    • start 流程开始,以圆角矩形绘制
    • opearation 操作,以直角矩形绘制
    • condition 判断,以菱形绘制
    • subroutine 子流程,以左右带空白框的矩形绘制
    • inputoutput 输入输出,以平行四边形绘制
    • end 流程结束,以圆角矩形绘制

  • 定义模块间的流向:

    • 模块1 id->模块2 id :一般的箭头指向
    • 条件模块id (描述)->模块id(direction) :条件模块跳转到对应的执行模块,并指定对应分支的布局方向


注意,每个形状都是有各自含义的:
  • 圆角矩形:表示开始和结束
  • 矩形:表示过程,也就是整个流程中的一个环节
  • 菱形:表示判断、决策
  • 圆形:表示连接。为避免流程过长或有线段交叉,可将流程切开,圆形即相当于切口处的连接头(成对出现)

1.png


阳光网络 发表于 2024-8-6 09:53:54 | 显示全部楼层

这是最简单的标准流程图

[flow]
start=>start: 接收到消息
info=>operation: 读取信息
setCache=>operation: 更新缓存
end=>end: 处理结束
start->info->setCache->end
[/flow]



start=>start: 接收到消息
info=>operation: 读取信息
setCache=>operation: 更新缓存
end=>end: 处理结束
start->info->setCache->end

阳光网络 发表于 2024-8-6 09:57:17 | 显示全部楼层

简易四步骤流程图

[flow]st=>start: Start
op=>operation: Your Operation
cond=>condition: Yes or No?
e=>end
st->op->cond
cond(yes)->e
cond(no)->op[/flow]

st=>start: Start
op=>operation: Your Operation
cond=>condition: Yes or No?
e=>end
st->op->cond
cond(yes)->e
cond(no)->op

阳光网络 发表于 2024-8-6 09:58:58 | 显示全部楼层

简易五步骤流程图

[flow]start=>start: API请求
cache=>operation: 读取Redis缓存
cached=>condition: 是否有缓存?
sendMq=>operation: 发送MQ,后台服务更新缓存
info=>operation: 读取信息
setCache=>operation: 保存缓存
end=>end: 返回信息
start->cache->cached
cached(yes)->sendMq
cached(no)->info
info->setCache
setCache->end
sendMq->end[/flow]


start=>start: API请求
cache=>operation: 读取Redis缓存
cached=>condition: 是否有缓存?
sendMq=>operation: 发送MQ,后台服务更新缓存
info=>operation: 读取信息
setCache=>operation: 保存缓存
end=>end: 返回信息
start->cache->cached
cached(yes)->sendMq
cached(no)->info
info->setCache
setCache->end
sendMq->end

阳光网络 发表于 2024-8-6 10:01:29 | 显示全部楼层

详解标准流程图

基本语法:
  • 定义模块 id=>关键字: 描述 (“描述”的前面必须有空格,“=>” 两端不能有空格)
  • 关键字:

    • start 流程开始,以圆角矩形绘制
    • opearation 操作,以直角矩形绘制
    • condition 判断,以菱形绘制
    • subroutine 子流程,以左右带空白框的矩形绘制
    • inputoutput 输入输出,以平行四边形绘制
    • end 流程结束,以圆角矩形绘制

  • 定义模块间的流向:

    • 模块1 id->模块2 id :一般的箭头指向
    • 条件模块id (描述)->模块id(direction) :条件模块跳转到对应的执行模块,并指定对应分支的布局方向


[flow]st=>start: 开始
ipt=>inputoutput: 输入一个x
op=>operation: 处理加工x+1
cond=>condition: 溢出(是或否?)
sub=>subroutine: 子流程
io=>inputoutput: 输出x
ed=>end: 结束
st->ipt->op->cond
cond(yes)->io->ed
cond(no)->sub->io->ed[/flow]


st=>start: 开始
ipt=>inputoutput: 输入一个x
op=>operation: 处理加工x+1
cond=>condition: 溢出(是或否?)
sub=>subroutine: 子流程
io=>inputoutput: 输出x
ed=>end: 结束
st->ipt->op->cond
cond(yes)->io->ed
cond(no)->sub->io->ed

阳光网络 发表于 2024-8-6 10:02:42 | 显示全部楼层

复杂三支线流程图

[flow]st=>start: Start|past:>http://www.google.com[blank]
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[/flow]

st=>start: Start|past:>http://www.google.com[blank]
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

给我们建议|手机版|阳光肺科 ( 粤ICP备2020077405号-1 )

GMT+8, 2024-11-14 12:07

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

快速回复 返回顶部 返回列表