创建后更改go.js portId

Question

扩展 Dynamic Ports 示例，我在 leftArray 中创建了一个带有几个端口的节点。每个端口都由这样的模型定义：

{id: "port1"}

在端口的上下文菜单中，我让用户重命名它。目前，出于测试目的，右键单击一个端口会打开一个带有单个按钮的上下文菜单："Rename"。单击 "Rename" 会将模型的 id 字段更改为 "foo":

function(e, obj) { 
   obj.part.data.id = "foo";
}

id 字段绑定到 portId 属性使用：

new go.Binding("portId", "id").makeTwoWay()

现在，当我从另一个节点创建一个 link 到这个重命名的端口并使用 myDiagram.model.toJson() 观察我的图表模型时，我看到 link 似乎连接到正确的端口，但使用 old portId.

我在这里想念什么？

谢谢

Answer 1

是的，您没有修改对端口的 link 数据引用，因此链接继续路由到相同的端口 GraphObjects。但是，如果您加载保存的模型，您会看到链接现在似乎连接到其他对象，具体取决于现在使用的端口标识符。

我建议在修改端口 ID 后迭代连接的 links 并更新端口引用。类似于动态端口示例中的这个额外的上下文菜单按钮：

makeButton("Rename port", function(e, obj) { var port = obj.part.adornedObject; var node = port.part; var data = port.data; var oldpid = data.portId; var linksinto = new go.List().addAll(node.findLinksInto(oldpid)); var linksoutof = new go.List().addAll(node.findLinksOutOf(oldpid)); myDiagram.startTransaction("portId"); // find a new unique port identifier var newpid = Math.floor(Math.random() * 1000000).toString(); while (node.findPort(newpid) !== node.port) { newpid = Math.floor(Math.random() * 1000000).toString(); } // change port identifier myDiagram.model.setDataProperty(data, "portId", newpid); // change connected link references to ports linksinto.each(function(l) { myDiagram.model.setToPortIdForLinkData(l.data, newpid); }); linksoutof.each(function(l) { myDiagram.model.setFromPortIdForLinkData(l.data, newpid); }); myDiagram.commitTransaction("portId"); }),

创建后更改go.js portId

Change go.js portId after creation

javascript

gojs