带有路径连接器的jQuery可拖动小部件

参考图像,Block1和Block2都是可拖动的。

我的问题是:如何在两个块之间制作像连接器一样的红色链? 要求是链应该延伸到拖动块的任何位置。 请提供教程/学习资料的任何指示。 谢谢。

在此处输入图像描述

有许多Jquery插件可用于创建数据库可视化或流程图的连接器。 如果像我这样的人正在寻找这样的插件,可能想看看下面的插件。

JointJS Rappid Mxgraph GoJS Raphael Draw2D D3 FabricJS paperJS JsPlumb FlowChart 

以下链接可能会有所帮助。

http://modeling-languages.com/javascript-drawing-libraries-diagrams/

GoJS允许您定义自己的链接路径自定义呈现,如下例所示: http : //gojs.net/latest/samples/relationships.html

以下是在定义链接模板时如何创建红色V形图案: $(go.Link, go.Link.Orthogonal, $(go.Shape, { stroke: transparent, pathPattern: $(go.Shape, { geometryString: "F1 M2 3 L0 0 6 0 8 3 6 6 0 6z", fill: "red", strokeWidth: 0 }) }) )

这会产生以下结果:

在此处输入图像描述