如何将节点传递给 cytoscape-cola.js 中的 gapInequalities？

Question

layout 字典的 gapInequalities 元素的 cytoscape.js-cola documentation 说：

  gapInequalities: undefined, // list of inequality constraints for the gap between the nodes,
                              // e.g. [{"axis":"y", "left":node1, "right":node2, "gap":25}]

如何设置在left和right的值中指定节点的对象？

maxkfranz 很有帮助地指出 here that these objects need to be collection objects。这些包含对指定节点 ("elements") 的引用，并通过查询 cytoscape.js "core object" 创建。我不清楚的是，鉴于 layout 对象需要引用节点元素，并且在 layout 告诉如何渲染它们之前不应将元素添加到图形中，你如何正确设置那些集合对象？

例如，要指定节点 b 应放置在节点 a 上方，下面代码中用什么代替 ???a??? 和 ???b???？

cy = cytoscape({
  elements: [
      { data: { id: 'a' } },
      { data: { id: 'b' } },
      . . .
  ],
  layout: {
    name: 'cola',
    gapInequalities: [
        { axis: 'y', left: ???'a'???, right: ???'b'???, gap: 25 }
        . . .
    ],
    . . .
  }
  . . .
]);

在这种情况下，答案不能是cy.$id('a')和cy.$id('b')，因为cy对象还没有被创建。您可以通过创建不带元素的 cy 对象然后调用 cy.add() 将它们放入来解决这个问题。但是传递给 cytoscape() 的 layout 对象中包含什么？

我对这两个都是新手 cytoscape.js and cola.js，所以我很可能只是在这里遗漏了一些非常基本的想法。一个简单的例子显示了哪些函数调用设置了对象以及调用它们的顺序可能会做到这一点。在我的应用程序中，节点和边是逐渐添加到图形中的，动画需要显示它们正在添加，所以无论如何在开始时不设置所有元素更有意义。

Answer 1

由于你的节点和边是逐渐添加的，你可以创建没有元素和布局对象的cy对象。然后当新节点出现时，您可以将它们添加到图中并应用布局。

cy对象初始化后，每次有新节点到来，应用如下：

cy.add(...);
cy.layout({
  name: 'cola',
  gapInequalities: [{ axis: 'y', left: cy.$id("a"), right: cy.$id("b"), gap: 25 }],
  ...
}).run();

如何将节点传递给 cytoscape-cola.js 中的 gapInequalities？

How do you pass nodes to gapInequalities in cytoscape-cola.js?

cytoscape.js

webcola