[英]Diagram Builder Custom Attributes on Connections
This is related to this question , but it is about adding custom node types and attributes to nodes (which I have been successful in doing), and I'm looking to add custom properties on connections themselves. 这与此问题有关 ,但是它涉及向节点添加自定义节点类型和属性(我已经成功完成了此操作),并且我正在寻求在连接本身上添加自定义属性。
I have tried overriding the methods getProperties
and getPropertyModel
on builder.connector
to no avail. 我尝试覆盖builder.connector
上的方法getProperties
和getPropertyModel
无效。 Below is my current (and what I believe to be closest) attempt: 以下是我目前(以及我认为最接近)的尝试:
// .. adding different node types and their attributes
var builder = new Y.DiagramBuilder( {
availableFields: availableFields,
boundingBox: '#diagramContainer',
srcNode: '#diagramBuilder'
} );
builder.render();
var test = builder.connector.addAttr(
'testAttr',
{
value:'test',
validator: Y.Lang.isString,
readOnly: false,
lazyAdd: false
},
false
);
builder.connector.SERIALIZABLE_ATTRS.push('testAttr');
// just calling addAttr doesn't seem to work, so I also tried this..
test.getProperties = function() {
return [
{
attributeName: 'testAttr',
editor: new Y.TextCellEditor(),
name: 'Test Attr',
value: 'default value??'
}
]
};
Looking in the source, there seems to be a STRINGS
property that may also need to be modified, but I can only find a method for getting the strings ( getStrings
) and no method for modifying them. 从源代码STRINGS
,似乎还有一个STRINGS
属性可能也需要修改,但我只能找到一种用于获取字符串的方法( getStrings
),而没有用于修改它们的方法。 I could try modifying it directly, but I'm not 100% sure what object it's present on (above it is not set on the builder.connector) 我可以尝试直接对其进行修改,但是我不能100%地确定它存在于哪个对象上(以上未在builder.connector上设置)
Thanks in advance. 提前致谢。
sorry these things aren't as straightforward as they could be :S 抱歉,这些事情并没有像可能的那么简单:
I've updated the old example with a working case of what you're looking for. 我已经用您要查找的工作案例更新了旧示例。 As before, not production code material, just enough to get you up and running ;) 和以前一样,不是生产代码材料,仅足以使您开始工作;)
If you look at the source code, one problem here is that the Y.DiagramBuilderImpl
creates its own Y.Connector
instances, so the way to go is to mix
some extensions into it to modify the behaviour. 如果查看源代码,这里的一个问题是Y.DiagramBuilderImpl
创建自己的Y.Connector
实例,因此方法是mix
一些扩展混入其中以修改行为。
As you can see in the example, we create an extension with 如您在示例中所见,我们使用
var CustomConnector = function() {
};
CustomConnector.ATTRS = {
testAttr: {
valueFn: function() {
return 'test attr instance value';
}
}
};
CustomConnector.prototype.initializer = function() {
var instance = this;
instance.SERIALIZABLE_ATTRS.push('testAttr');
};
CustomConnector.prototype.getPropertyModel = function() {
var instance = this;
return [
{
attributeName: 'testAttr',
editor: new Y.TextCellEditor(),
name: 'Test Attr'
}
];
};
Then, we mix
the extension into the existing Y.Connector
adding and overriding functionality as desired with: 然后,根据需要,将扩展名mix
到现有的Y.Connector
添加和覆盖功能中:
Y.Base.mix(Y.Connector, [CustomConnector]);
One additional option could be for you to create your own CustomConnector
class extending Y.Connector
(see Base.create ) and then setting that as the connector class for your DiagramBuilder
such as: 另一个选择是让您创建扩展Y.Connector
自己的CustomConnector
类(请参见Base.create ),然后将其设置为DiagramBuilder
的连接器类,例如:
var builder = new Y.DiagramBuilder( {
availableFields: availableFields,
boundingBox: '#diagramContainer',
connector: CustomConnector,
srcNode: '#diagramBuilder'
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.