我可以在jointjs元素中添加新属性吗?

Can I add new attributes in jointjs element?

本文关键字:属性 新属性 jointjs 元素 添加 我可以      更新时间:2023-09-26

我想创建一个具有新属性的自定义元素,我创建了我的自定义元素,但是我需要一个新属性来存储有关元素的信息。

joint.shapes.basic.newRect = joint.shapes.basic.Generic.extend({
markup: '<g class="rotatable"><g class="scalable"><rect/></g><text/></g>',
defaults: joint.util.deepSupplement({
    type: 'basic.newRect',
    attrs: {
        'rect': { fill: 'white', stroke: 'black', 'follow-scale': true, width: 80, height: 40 },
        'text': { 'font-size': 14, 'ref-x': .5, 'ref-y': .5, ref: 'rect', 'y-alignment': 'middle', 'x-alignment': 'middle' }
    }
}, joint.shapes.basic.Generic.prototype.defaults)

谢谢!

可以在typeattrs旁边添加新的属性。这些将是元素的默认属性,如下所示:

joint.shapes.basic.newRect = joint.shapes.basic.Generic.extend({
markup: '<g class="rotatable"><g class="scalable"><rect/></g><text/></g>',
defaults: joint.util.deepSupplement({
    type: 'basic.newRect',
    attrs: {
        'rect': { fill: 'white', stroke: 'black', 'follow-scale': true, width: 80, height: 40 },
        'text': { 'font-size': 14, 'ref-x': .5, 'ref-y': .5, ref: 'rect', 'y-alignment': 'middle', 'x-alignment': 'middle' }
    },
    mycustom: 'foo'
}, joint.shapes.basic.Generic.prototype.defaults)

以后当你实例化你的元素时,你也可以只给那个特定的元素添加属性:

var myNewRect = new joint.shapes.basic.newRect({ position: { x: 1, y: 1 }});
myNewRect.set('mycustom2', 'bar')
myNewRect.get('mycustom') // 'foo'
myNewRect.get('mycustom2') // 'bar'

所有这些属性在序列化图时也会被考虑。

您也可以使用提供的Element#prop。看到http://jointjs.com/api joint.dia.Element:道具