JOINTJS : 링크의 모양을 자체 참조하기

Question

링크의 모양을 자기 참조하고 싶습니다. 기본적으로 링크의 소스와 대상은 같습니다. 그것은이 작동하지만 링크가 모양으로 숨겨져

: 나는의 정의에 "정점"을 사용할 수 있다는 것을 알고 https://imageshack.com/i/mujp9lp

을 : 여기 https://imageshack.com/i/f2mu7jp

내가하고 싶은 것입니다 링크가 있지만 시작점과 끝점의 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); 
}; 

어떻게 시작점과 끝점의 위치를 ​​얻을 수 있습니까?

그것은 공식 API에서가 아니라 링크 의견에 getConnectionPoint() 방법이 당신

Answer 1

감사드립니다. 연결 지점을 알면 자체 링크에 필요한 2 개의 꼭지점을 계산할 수 있습니다.

... graph.addCell (링크) 후 ... -이 시점에서 링크보기가 종이에 만들어집니다. .

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', sourceOrTargetOrPoint 중 하나 link.get('source') 또는 link.get('target') 및 referenceSourceOrTargetOrPoint은 "끈끈한"점 (링크 또는 가장 가까운 정점 보통 다른 쪽)을 계산하는 데 필요한 기준점입니다.