javascript - 在 Node Tap Cytoscape 上隐藏和显示子节点

标签 javascript cytoscape.js cytoscape

我正在尝试使用广度优先布局在 Cytoscape 中创建一个可折叠的树结构,以复制 D3 collapsible tree .

我试图在节点上复制这种类型的点击操作,但另外添加恢复功能 - Images & breadthfirst layout

我选择 Cytoscape 的原因是因为我有一个场景,其中树的节点超过 1 个父节点。

我尝试使用以下代码添加点击事件:

cy.on('tap', 'node', function() {
    if (this.scratch().restData == null) {
       // Save node data and remove
       this.scratch({
            restData: this.connectedEdges().targets().remove()
       });
    } else {
       // Restore the removed nodes from saved data
       this.scratch().restData.restore();
       this.scratch({
            restData: null
       });
    }
}

但是,这仅能成功折叠和展开其直接子节点(其余节点仍然可见),并且在我点击叶节点时也会导致问题。

如果有人知道展开和折叠节点的方法,请帮忙。

编辑:伙计们,如果有人也知道简单多级树的解决方案,那也是一个好的开始...

最佳答案

我替换了这行代码:

 restData: this.connectedEdges().targets().remove()

用这个:

restData: this.successors().targets().remove()

并且此代码现在折叠子节点和孙节点(仅在 3 个级别上测试)并且叶节点在单击时不再折叠到其父节点中。

关于javascript - 在 Node Tap Cytoscape 上隐藏和显示子节点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41506664/

相关文章:

javascript - 如何使用php将PDF文件嵌入到iframe中

graph - cytoscape js标签显示,如何换行文字

javascript - 未捕获的 TypeError : $(. ..).cytoscape 不是函数

javascript - 在js.cytoscape中限制鼠标滚动功能

javascript - 仅从 ES6 模块导入静态变量

javascript - 如果通过 jquery 更新,Vuejs 绑定(bind)不起作用

javascript - 选择菜单不改变.css

javascript - 使用 while 循环迭代遍历图

javascript - 细胞景观 : Add element in setTimeout doesn't get rendered

python-3.x - py2cytoscape - 自动保存 View