flowchart流程图(以文本的语法在浏览器或终端构造流程图)

 2024-09-24  阅读 277  评论 0

摘要:介绍flowchart.js是在浏览器和终端中运行的流程图DSL和SVG渲染。节点和连接是分别定义的,因此可以重复使用节点,并可以快速更改连接。也可以在DSL中对节点和连接器样式进行细微的更改。Github示例以下是一个简单的示例(flowchart.js依赖raphael):下面是一段带有颜色的示
介绍

flowchart.js是在浏览器和终端中运行的流程图DSL和SVG渲染。节点和连接是分别定义的,因此可以重复使用节点,并可以快速更改连接。也可以在DSL中对节点和连接器样式进行细微的更改。


flowchart流程图(以文本的语法在浏览器或终端构造流程图)(1)


Github示例

以下是一个简单的示例(flowchart.js依赖raphael):

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(2)

下面是一段带有颜色的示例:

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(3)

以下是一个完成的demo:

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(4)

节点类型语法
  • start

用作流从其开始的第一个节点。默认文本为“start”

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(5)

  • end

用作流结束的最后一个节点。默认文本为“end”

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(6)

  • operation

表示需要在流中进行操作:

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(7)

  • inputoutput

输入输出

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(8)

  • subroutine(子程序)

指示流中的子流程,并且应该有另一个流程图记录该子流程

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(9)

  • condition(条件)

允许条件或逻辑语句将流定向到两个或多个路径之一

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(10)

  • parallel

允许多个流程同时出现

flowchart流程图(以文本的语法在浏览器或终端构造流程图)(11)

总结

本文简单介绍了flowchart.js在浏览器中的的用法,它还可以在终端使用,如果你有需要在浏览器或者终端绘制简单的流程图,那么flowchart.js将会是你可以选择的工具,感兴趣的可以直接到官网文档在线查看编写效果,可从Github进入!

,

版权声明:xxxxxxxxx;

原文链接:http://cn.tdroid.net/ceca9Cz0EBw0MVFU.html

发表评论:

管理员

  • 内容265783
  • 积分0
  • 金币0
关于我们
lecms主程序为免费提供使用,使用者不得将本系统应用于任何形式的非法用途,由此产生的一切法律风险,需由使用者自行承担,与本站和开发者无关。一旦使用lecms,表示您即承认您已阅读、理解并同意受此条款的约束,并遵守所有相应法律和法规。
联系方式
电话:
地址:广东省中山市
Email:
注册登录
注册帐号
登录帐号

Copyright © 2022 太卓开发网 Inc. 保留所有权利。 泰达科技网易库网

页面耗时0.0998秒, 内存占用1.33 MB, 访问数据库18次