这里主要是针对于工作流场景的流程图绘制及实现方式。下面是效果图： 整体结构布局： 需要实现的功能列表： 节点与连接线的可配置 节点的拖拽与渲染及连接线的绘制 节点与连接线的选择 节点的样式调...

本文中结合 A* 寻路算法实现了流程图正交连线，将依次从地图构建、拐点优化、区域优化、边界条件判定方面来实现。

其实有很多库已经实现了流程图，比如 jointjs，gojs，jsplumb 等等。可惜都不是免费的。 如果要做的简单呢，就用贝塞尔曲线就好了，只需要提供起点终点两个点的坐标，就能用简单的算法生成一个svg 的path了。这样算法网上应该找得到。 但是如果要用正交连线来实现，这…

因业务关系，新增绘制流程图需求，最开始想使用第三方库，调研后总有部分功能不能满足，考虑后期需求变更的情况，决定自己研发。经多番调研，确认使用svg和d3绘制流程图，并封装为npm包。本文主要讲解封装库的前期规划、部分实现方式以及里面涉及到的一些好的idea。这是封装好库reac…

活动（Activity）：是用来指代要完成的活动，通过由流程组合在一起而发挥效用。 事件（Event）：用来表明流程的生命周期中发生了什么事。 网关（Gateway）：用来控制流程的流向。 流向（Flow）：是连接两个流程节点的连线。 bpmn-moddle: 使我们能够读写 …

严重拖延症，一方面这项目模块纯属个人娱乐。另一方面，流程图这块涉及的东西还是蛮多的，这次也只是介绍一些简单的部分。拖了这么久，现在终于要开始硬着头皮写一篇基于vue+svg的流程图"伪教程"文章了。初次献丑，还请轻喷。 出于学习vue而非兼容的目的，本项目仅考虑现代浏览器( 谷…

没有在网上找到好用的kityminder-editor的Vue组件，所以在kityminder-editor的示例基础上，快速改成了vue组件。 安装 main.js 使用 暴露的方法与参数 init

在工作和学习中少不了用思维导图作为工具，我们经常用xmind等软件做导图，那么如何开发一个web在线的思维导图呢，这里给大家介绍一种开发思路，大家一起交流一下。