Javascript 如何在js中创建工作流图

我想创建具有良好样式和拖放功能的工作流程图，以创建新形状（可缩放形状，如圆形、圆形矩形、箭头/连接器等），如下链接所示：

我想实现链接中的确切功能。如果您在页面源代码中看到，该站点使用了png图像、innerssvg.js、cssparser.js、canvg等

我一直在研究d3.js、jsplumb、sigms.js，但没有确切的文档或解决方案来说明哪个javascript库适合我的需求

我已经用d3创建了一个可拖动和可拉伸的圆。类似地，我想创建一个箭头连接器和形状是通过拖放创建的

---

哪一个js库适用于此以及良好的css样式（重要）和未来的定制

我不能为您提到的任何其他库说话，但您也肯定能够使用d3创建类似的程序。也就是说，这可能是一个相当漫长的过程。您可以在包含所有形状的一侧有一个

g

元素（使用.drag和鼠标悬停光标分类）。当拖动事件注册时，

x>[threshold]

，然后将其中一个附加到主svg区域。使用路径元素来表示行等。D3对于CSS来说也非常好，因为您可以轻松地使用

.style（，）

一次更改多个项目的属性。jsjoint呢？听说它适合工作流程，但我能用jsjoint或d3实现良好的样式和决策流程吗？另外，我没有看到在形状上使用连接点来连接d3中的箭头，我可能会考虑是否可以集成Snap.svg（其中有抓拍链接，例如和jsplumb，看看他们玩得有多好。派对有点晚了，但这是D3中对象之间连接线的一个例子。