Как сделать так, чтобы Jointjs.dia.link заканчивался кружком? - PullRequest
0 голосов
/ 22 декабря 2018

Я перенес старый кусок кода, который использовал jointjs v0.9, до самой последней версии (2.2.1).Есть эта часть кода, которая создает простую ссылку с небольшим кружком в конце (целевой маркер), но в самой последней версии этот код не работает:

 link = new Joint.dia.Link({
    source: { x: x, y: 0 }
    target: { x: x, y: y }
    markup: '<path class="connection" d="M 0 0 0 0"/><circle r="5" />'
    attrs: { '.connection': `connection ${this.getStyleClass()}`
 })

Как создатьсвязать Join.dia.link с кружком в качестве целевого маркера?

1 Ответ

0 голосов
/ 28 декабря 2018
var link = new joint.dia.Link({
    source: {
        id: srcId
    },
    target: {
        id: destId
    }, 
    router: { name: 'manhattan' },
    connector: { name: 'rounded' },
    toolMarkup: "none"
});
link.attr({
    '.marker-target': { fill: 'red', d: 'M 0, 0 m -5, 0 a 5,5 0 1,0 10,0 a 5,5 0 1,0 -10,0', stroke: 'none' },
    '.connection': { stroke: 'red', 'stroke-width': '1px' },
    '.marker-arrowheads': { display: "none" }
});

При этом d: 'M 0, 0 m -5, 0 a 5,5 0 1,0 10,0 a 5,5 0 1,0 -10,0' устанавливает круг в конец ссылки.Если вам нужна любая другая фигура, вы можете написать ее путь и установить ее здесь.

...