写了一款开源思维导图设计器

科技   2024-10-22 14:01   重庆  

嗨, 大家好, 我是徐小夕.

上一期内容和大家分享了我开源的 flowmix-flow 可视化流程引擎, 它可以轻松创建可视化工作流, 并且可以基于这套开源方案, 轻松定制企业自己的工作流引擎.

开源地址: https://github.com/MrXujiang/flowmix-flow

线上demo: http://flowmix.turntip.cn/flow-v0

国内镜像: https://gitee.com/lowcode-china/flowmix-flow

随着最近对 flow 的深入研究, 我在开源的flowmix-flow 基础上, 又写了一个思维导图的开源方案, 今天就来和大家分享一下.

demo演示

我们可以使用它轻松的创建思维导图, 并轻松集成到自己的项目中. 当然这个是最小化的版本, 还有很多功能大家也可以在此基础上进行扩展.

当然这个设计器已经实现了常用的功能, 比如:

  • 节点编辑
  • 节点多选全选
  • 组件图层面板
  • 画布控件(放大缩小复位清空等)
  • 参考线吸附
  • 自定义节点能力
  • 自定义边能力
  • 多handles模式

接下来我会分享一些与之前我做的工作流不同的特点, 如果大家想研究学习工作流引擎, 可以看我之前的文章:

flowmix-flow可视化流程引擎, 开源!

自定义连接点

自定义连接点就类似于Dify, 它比较适合流程引擎的多任务模式, 我们可以基于子流程连接不同的逻辑.

自定义连接线箭头

前的连线没有两端的箭头, 对于有流程性的业务来说缺乏指示性效果, 所以在思维导图中我加上了自定义的连接线端点箭头, 如果大家有类似的需求可以参考我源码中的实现.

图层双向面板

图层双向面板也是一个很重要的能力, 我们可以通过节点的选择, 来映射到图层面板, 同时也可以通过图层面板, 对节点进行快捷的操作.

目前这个项目我开源在下面仓库的 flow-mind 分支, 大家感兴趣可以学习参考一下.

开源地址: https://github.com/MrXujiang/flowmix-flow

线上demo: http://flowmix.turntip.cn/flow-v1

国内镜像: https://gitee.com/lowcode-china/flowmix-flow

如果大家对工作流, 流程引擎感兴趣, 也可以在下方交流讨论:

最近做的多模态文档产品

也许关注我公众号的朋友已经看过我之前做的另一款产品——flowmix/docx, 它是另一款搭建类产品, 类似于飞书和Notion, 可以使用它轻松构建企业下一代知识库产品.

后面会和flow结合, 做更深度的产品赋能, 如果大家感兴趣, 也可以在线体验一下.

体验地址: http://flowmix.turntip.cn/docx/

后续我会在 flowmix 公众号中持续分享flowmix零代码搭建系列产品和规划, 感兴趣的朋友可以关注一下:

如果你有好的想法和建议, 也欢迎随时留言区交流讨论~

往期精彩:

趣谈前端
徐小夕【知乎专栏作家】掘金签约作者,定期分享前端工程化,可视化,企业实战项目知识,深度复盘企业中经常遇到的500+技术问题解决方案。【关注趣谈前端,前端路上不迷茫】
 最新文章