jointjs -- link

line label

jointjs线条label改变的几个函数

line.labels(labels,opt)

labels 对象数组

l.labels([{
    attrs: {
        text: {
            text: 'labeds\nafdsfadf\nals',
            fill: 'white',
            fontFamily: 'sans-serif'
        },
        rect: {
            fill: '#31d0c6',
            stroke: '#31d0c6',
            strokeWidth: 20,
            rx: 5,
            ry: 5
        }
    },
    position: 0.55
}]);

这个函数当没有参数时,返回当前labels数组。有参数时改变label。第一个参数是一个如上代码的数组,第二个参数我还不知道有什么用,this.set函数到backbone.min.js里面去了,没看

line.append(label,opt)

label 对象

这个函数就比较简单了,就是调用insetLabel函数,idx为-1,意思就是在原有label数组后加入这个对象,这个label参是一个对象。

line.insertLabel(idx,label,opt)

idx 索引

label 对象

这个函数就是获取到当前labels,然后判断传进来的label应该插入到什么位置。最后调用label函数,改变。

line.removeLabel(idx,opt)

idx 索引

这个就是删除某一个label就没什么了。

其它一些常用的线条方法

// unlike target(), this method returns null if target is a point
getSourceElement()
getTargetElement()

改线中的label还可以作用一下这种方法,但是有个缺点是文本变化不是同样行数的话,label不居中

link.attr('text/text','通过');
link.attr('text/fill','#87D068');
link.attr({'.connection': { stroke: '#87D068'}});

猜你喜欢

转载自blog.csdn.net/qq_40285497/article/details/82703389