Question

我正在使用 cytoscape.js 和 cytoscape.js-expand-collapse 在我的图形结构中创建动态层次结构。我希望能够动态创建一个折叠的（合并的）节点，该节点可能会被扩展，删除或与其他节点重新合并。每当我致电nodes.move({parent:null})时，我都会遇到麻烦。它们与图分离，我无法将它们重新附加到新的parentNode。如果我在它们上调用restore，将会看到错误消息，指出它们已经存在于图形中。

merge和unmerge本身在没有现有折叠节点的简单情况下也可以正常工作。但是，在已经包含复合折叠节点的对象上调用merge会破坏事情。我将得到没有先前折叠的合并候选者的子节点的结果合并节点

更新＃1 我已经意识到我的问题是返回了错误的移动节点。在集合上调用.move将返回一组新的节点。因此unmerge应该返回这些值。

更新＃2 ，cytoscape-expand-collapse实用程序在父节点折叠/展开过程中通过将节点数据隐藏在元边缘的“ originalEnds”数据属性中进行一些内部记账。因此，如果我现在通过将节点移入/移出父节点来动态更改图，则这些originalEnds指针将不同步，从而导致无限循环。我正在做一些其他的我自己的节点跟踪作为解决方法。

function merge(nodes){
    //if one of the nodes is a compound itself, first uncollapse, then merge
    var collapsed = nodes.filter(function(c){return typeof c.data('collapsedChildren')!=='undefined';});
    if (collapsed.length>0) {
        // for now just assume collapsed is a length of 1
        var unmerged = unmerge(collapsed); //unmerged should be now the former collapsed children
        nodes = nodes.subtract(collapsed).union(unmerged.nodes());
    }
    var parentNode = cy.add({group:'nodes', data: {id: parentID}});
    nodes.move({parent: parentID});
    collapseApi.collapse(parentNode);
    return parentNode;
}

function unmerge(parentNode){
    collapseApi.expand(parentNode);
    var children = parentNode.children();
    var moved = children.move({parent:null});
    //at this point children become "detached" from the graph
    // .removed() returns true, however, calling restore() logs an error and they are still technically in the graph
    parentNode.remove();
    return moved;
}

Answer 1

ele.move()在cytoscape> = 3.4中有一个更方便的实现：元素被就地修改，而不是创建替换元素。

使用从ele.move()返回的集合的旧代码仍然可以使用。不必完全使用返回的集合，从而可以简化新代码。

尝试将节点扩展为空父级

1 个答案: