美文网首页vue收录
基于antv G6 和vue 的可视化流程图编辑器

基于antv G6 和vue 的可视化流程图编辑器

作者: 坏男银 | 来源:发表于2020-03-09 10:02 被阅读0次

    流程图包含开始,结束,工具,分支节点。

    节点样式参考了蓝鲸智云的标准运维(https://bk.tencent.com/docs/document/5.1/3/45),如下图。

    下图是通过鼠标正在连线

    具体的实现参考了几个大神的代码

    https://github.com/caoyu48/vue-g6-editor

    https://github.com/OXOYO/X-Flowchart-Vue

    实现功能:

    拖动生成节点、连线、位置微调、撤销重做等

    代码比较辣鸡,大神看到的话请多提宝贵意见

    封装成了组件的形式,代码: https://pan.baidu.com/s/10mPMZBVClHaeDjDkG4eUOQ 提取码: mbxw

    相关文章

      网友评论

        本文标题:基于antv G6 和vue 的可视化流程图编辑器

        本文链接:https://www.haomeiwen.com/subject/hfzydhtx.html