
1.流程创建入口;
a.在创建入口之前,定义当前被选中节点信息currentEditor和当前流程图信息currentGraph(后面保存和编辑会用到);
b.定义容器container, 上侧工具栏容器outline,上侧工具栏的逻辑效果 toolbar,左边工具栏拖动 sidebar, 当前节点信息status;
c.封装左侧图标的拖到函数,在拖动时,创建节点的第一个节点,var parent = graph.getDefaultParent(),然后获取数据graph.getModel(),最终在画布上展示 model.beginUpdate(),设置当前添加节点的样式graph.setSelectionCell(v1);

2.给每个节点增加双击事件

3.获取当前流程信息
currentEditor.writeGraphModel();
4.双击打开当前节点信息弹框,获取当前节点信息,比如:
parent.curre

本文记录了使用mxGraph库进行流程设计的过程,包括创建流程入口、节点双击事件、获取和保存流程信息、弹框显示节点详情、插入和删除节点的操作。在实现过程中,特别提到按delete键删除节点可能遇到的问题及其解决方案。
最低0.47元/天 解锁文章
1173





