JTopo + Vue 实现自定义拖拽流程图

市场上做流程图的插件比较多,这里介绍一种基于canvas编写的js插件,结合vue框架做出精美的流程图
首先搭建vue框架,这里就不做介绍,由于jtopo官方demo里用到了jquery,所以我的项目里也引用了jquery插件,鉴于这里用到了很多的dom操作,所以建议大家也直接引用jquery进行操作;
然后将jtopo.js下载到本地,放到自己的vue项目的静态文件目录下,如下图:
JTopo + Vue 实现自定义拖拽流程图
最终实现效果如下图
JTopo + Vue 实现自定义拖拽流程图
节点右键编辑
JTopo + Vue 实现自定义拖拽流程图
点击线操作
JTopo + Vue 实现自定义拖拽流程图
代码在不断完善中,有不错的建议和意见欢迎提出!

进入体验效果
进入github

相关文章:

  • 2021-06-11
  • 2021-07-24
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-11-27
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-12-15
  • 2022-12-23
  • 2023-03-28
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案