Javascript AngularJS-将拖放与流程图相结合

我正在尝试创建一个具有拖放功能的流程图，如

组件列表是动态的，每个组件可以显示一次atmost， 第一列和最后一列只能有一个组件，而它们之间的所有列都可以有atmost 3个组件，这3个组件列可以有n个 我已经调查过了 及 但是我想不出一个方法来组合它们，有什么想法吗

---

提前感谢……）

有趣的项目！我相信SVG和D3.js与AngularJS的结合将非常适合这一点。d3可以包装成AngularjS指令。它有很多很酷的特性，从头开始构建可能会很乏味。下面是我将如何处理这个问题

具有从主控制器获取数据模型的流程图容器指令。数据模型包含关于每个框的信息[框我指的是图表上的文本1、文本2等]。然后，流程图容器可以在数据模型中循环，并为每个框创建一个指令。您可以使用类似ng repeat的方法“循环”数据模型。现在这里是另一个指令发挥作用的地方。叫它盒子。盒子负责画盒子。为此，您可以轻松地使用SVG。此外，您还可以将d3.js的拖动功能放在TheBox指令的link函数中

有关更多信息：

我希望我的回答对你有所帮助