Skip to content

Latest commit

 

History

History
37 lines (22 loc) · 1.07 KB

README.md

File metadata and controls

37 lines (22 loc) · 1.07 KB

flowchart-angular6

一个基于jsplumb的使用angular6写的一个可拖拽的流程图实例(目前已更新到Angular 7版本)

更新:解决ng-zorro版本更新带来的图标加载问题(由于集成了两种icon加载方式,弹出框的icon会出现两个,之后有时间再修改)

  • 网上找了很久都没有找到用angular实现的可拖拽式的流程图组件,于是就基于jsplumb自己写了一个,实现了一些基本的功能,后续可能会再添加点。

demo演示

image image

实现的功能:

  • 拖拽式添加节点
  • 拖拽式连线
  • 删除节点
  • 双击连接线删除连接线
  • 设置参数
  • 上传文件
  • 流程图转json数据
  • json数据转流程图
  • 连接线中新增按钮功能,可点击选择文件

使用

  • clone代码
  • npm install
  • ng serve
  • 在浏览器中浏览:localhost:4200