1

我想在链接中自我引用一个形状。基本上链接的源和目标是相同的。

它正在工作,但链接被形状隐藏: https ://imageshack.com/i/f2mu7jp

这是我想做的: https ://imageshack.com/i/mujp9lp

我知道我可以在链接的定义中使用“顶点”,但我不知道起点和终点的 XY 位置

var connect = function(source, sourcePort, target, targetPort) {
    var link = new joint.shapes.devs.Link({
        source: { id: source.id, selector: source.getPortSelector(sourcePort) },
        target: { id: target.id, selector: target.getPortSelector(targetPort) }
    });
    if(source == target){
        console.log(link);
        console.log(source);
    }

    graph.addCell(link);
};

如何获得起点和终点的位置?

谢谢

4

1 回答 1

1

它不在官方 API 中,但有一个getConnectionPoint()关于链接视图的方法。通过了解连接点,您可以计算自链接所需的 2 个顶点:

...在graph.addCell(link)...之后-此时链接视图在论文中创建...

var linkView = paper.findViewByModel(link);
var sourcePoint = linkView.getConnectionPoint(
    'source', 
    link.get('source'),
    _.first(link.get('vertices')) || link.get('target'));
var targetPoint = linkView.getConnectionPoint(
    'target',
    link.get('target'),
    _.last(link.get('vertices')) || sourcePoint);

...现在您可以计算其他 2 个顶点(用于正交自链接)并执行以下操作:

link.set('vertices', myTwoVertexArray);

getConnectionPoint() 方法的签名是:

getConnectionPoint(end, sourceOrTargetOrPoint, referenceSourceOrTargetOrPoint);

哪里end'source''target'sourceOrTargetOrPointlink.get('source')link.get('target')referenceSourceOrTargetOrPoint是计算“粘性”点(通常是链接的另一侧或最近的顶点)所需的参考点。

于 2014-01-13T20:43:51.743 回答