笔记, 若干个流程图前端类库

12

为了方案探索, 查看了一下几个网上比较好找到的库, 看下对于我们定制的需求是否足够...

Raphael

  • SVG
  • 可以拖拽卡片, 不能拖拽线条
  • 没有文字

http://dmitrybaranovskiy.gith...

clipboard.png

gojs

https://gojs.net/latest/sampl...

  • SVG
  • 可以编辑文字
  • 注意左边是有编辑区域
  • 可以拖拽卡片, 可以拖拽连线
  • 连线上有节点连线上不能新增节点, 只能在某些方向上调整
  • 不知道怎么删除

clipboard.png

jointjs

http://resources.jointjs.com/...

  • 可以拖拽, 连线当中可以添加删除关键点
  • 连线上面有文字
  • 不知道怎么增加删除

clipboard.png

jgraph

https://jgraph.github.io/mxgr...

  • 可以拖拽
  • 箭头可以脱离卡片
  • 连线没看到拐弯的操作, 或者说没有看到可以插入关键点
  • 文字可以编辑
  • 不知道怎么添加连线

clipboard.png

flowchart.js

https://flowchart.js.org/

  • 只是图, 不能编辑
  • 基于 UML 生成图片

clipboard.png

G6

看不懂...


如果觉得我的文章对你有用,请随意赞赏

你可能感兴趣的

xiadd · 2018年06月06日

https://jgraph.github.io/mxgr... 我觉得这个好....🙄

+1 回复

0

您好,请问您知道mxgraph如何使得编辑后的图片导出吗?

Marksssss · 2018年06月21日
BerQin · 2018年06月07日

drawTopology
地址:https://berqin.github.io/draw...

+1 回复

Tclz_zhang · 2018年06月11日

raphael是可以加文字的,我觉得最好的应该是这种http://www.hightopo.com/demos...

+1 回复

丶Bó · 2018年08月29日

在帮你补充一个 https://bpmn.io/toolkit/bpmn-js/

+1 回复

Jemair · 2018年06月07日

hhhhhh最后一个戳中萌点

回复

toBeTheLight · 2018年06月07日

我记得在github上发现了个react写的,能拉线能写文字,后来怎么找都找不到了。

回复

载入中...