✨ 特点

  • 拖拽式更新工作流程图
  • 数据与图双向转换

📦 原理

拖拽

基于 react-dnd 和 react-dnd-html5-backend 创建拖拽节点与背景画布。

图

基于 g6 创建可视化图，根据 api 提供的 registerBehavior 注册行为，监听鼠标事件，基于 g6 提供的 ToolBar, Menu, Minimap, Grid 等插件，提供更多功能。

样式

基于 antd 提供的 UI 组件优化样式。

💡 预览

请查看 在线 Demo

🔨 说明

项目仅供学习和参考，或许不适合直接用于项目中，项目地址;

作者: Kavience 本文链接: http://www.kavience.com/frontend/demo-of-flow-chart-editor-based-on-g6.html 转载请注明:《基于g6的流程图编辑器Demo》转自 http://www.kavience.com/frontend/demo-of-flow-chart-editor-based-on-g6.html，原作者：Kavience 版权声明: 自由转载-非商用-非衍生-保持署名（创意共享3.0许可证）
分类
frontend
标签
g6 流程图