JointJS:如何创建具有 2 个不同边的单侧链接

Question

我正在尝试创建一个链接，从一个具有固定边的形状链接到另一个具有不同固定边的形状。这可能吗？

link.router('oneSide', {
side: 'top',
padding: 30
});

https://resources.jointjs.com/docs/jointjs/v3.1/joint.html#routers.oneSide

Answer 1

我不确定"oneSide"是否应该在路由器中，因为在文档中，路由器只定义了路径的中间点，而不是起点和终点。

在任一情况下，路由器函数都必须返回链路应经过的路由点数组(不包括开始/结束连接点(。该函数应具有表单函数(顶点，参数，链接视图(

我发现在定义链接时，您可以指定锚点，该锚点基本上是起点和终点。对于形状，有一些内置的锚点。在这种情况下，我们必须使用"左"和"右"。

这是我的代码。它在TypeScript中，但我相信如果需要，您可以轻松地将其转换为JS。

makeLink(parentElementLabel, childElementLabel) {
return new joint.shapes.standard.Link({
source: {
id: parentElementLabel,
anchor: {
name: 'right'
}
},
target: {
id: childElementLabel,
anchor: {
name: 'left'
}
},
router: {
name: 'normal'
},
attrs: {
line: {
stroke: 'black',
cursor: 'default',
},
wrapper: {
cursor: 'default'
}
},
// smooth: true,
});
}