前段时间手写一个画审批流程的功能，当时使用的纯svg实现的，使用期间遇到了一些问题，纯svg实现逻辑会复杂一些，比如：svg矩形不能写文字、元素内不能放子元素等，所以这次使用“DIV+SVG”重新开发一版。
上一个纯SVG纯地址是：SVG绘制流程图_高彬的博客-CSDN博客_svg流程图项目中需要绘制流程图，在网上找了几个开源插件，了解后项目要求都不完全匹配，改代码几乎不可能，代码太长了，看懂都是一个问题！！因此从零手写，参考了wps和ProcessOn的流程图前端代码，想出两种方案：一、div+canvas；二：svg或div+svg，我们流程图元素不多所以不涉及到性能问题，因此不用考虑太多，两个都可用，本例中使用纯SVG制作流程图，效果如下：上图是其中一列，可以根据需求绘制出不同的流程图，目前约有1000行代码，还在不断的完善和升级中，代码太多，给出开发过程中重点代码，关键https://blog.csdn.net/dystocia/article/details/113532580?spm=1001.2014.3001.5501?本次只使用svg画箭头，其他全部使用HTML标签实现，由于基于上一次的经验开发，因此这里没有什么难点，直接提供源码供大家参考：
效果：
?
提示：通过 getData()获取json，其中steps是审批步骤json，arrows是连接线。??
