gpt4 book ai didi

javascript - 删除在 DFS 算法 cytoscape JS 中发现的边缘

转载 作者:行者123 更新时间:2023-11-29 23:09:35 26 4
gpt4 key购买 nike

今天我开始使用 cytoscape 并尝试在准备好的图形上进行 DFS 搜索。我想删除算法会考虑的所有边。

var dfs = cy.elements().dfs('#0', function(v, e, u, i, depth){}, false);
var highlightNextEle = function(){
if( i < dfs.path.length ){
dfs.path[i+1].remove();
i++;
setTimeout(highlightNextEle, 1000);
}
};
highlightNextEle();

我试过这段代码,他删除了第一个边,但随后他删除了与启动节点相关的所有内容。对于任何提示,提前感谢您

最佳答案

如果你想删除在 dfs 中找到的边,你可以像这样使用 dfs 中的处理函数:

var cy = window.cy = cytoscape({
container: document.getElementById('cy'),

boxSelectionEnabled: false,
autounselectify: true,

style: [{
selector: 'node',
css: {
'content': 'data(id)',
'text-valign': 'center',
'text-halign': 'center',
'height': '60px',
'width': '60px',
'border-color': 'black',
'border-opacity': '1',
'border-width': '10px'
}
},
{
selector: '$node > node',
css: {
'padding-top': '10px',
'padding-left': '10px',
'padding-bottom': '10px',
'padding-right': '10px',
'text-valign': 'top',
'text-halign': 'center',
'background-color': '#bbb'
}
},
{
selector: 'edge',
css: {
'target-arrow-shape': 'triangle'
}
},
{
selector: ':selected',
css: {
'background-color': 'black',
'line-color': 'black',
'target-arrow-color': 'black',
'source-arrow-color': 'black'
}
}
],

elements: {
nodes: [{
data: {
id: 'n0'
}
},
{
data: {
id: 'n1'
}
},
{
data: {
id: 'n2'
}
},
{
data: {
id: 'n3'
}
},
{
data: {
id: 'n4'
}
},
{
data: {
id: 'n5'
}
},
{
data: {
id: 'n6'
}
},
{
data: {
id: 'n7'
}
},
{
data: {
id: 'n8'
}
},
{
data: {
id: 'n9'
}
},
{
data: {
id: 'n10'
}
},
{
data: {
id: 'n11'
}
},
{
data: {
id: 'n12'
}
},
{
data: {
id: 'n13'
}
},
{
data: {
id: 'n14'
}
},
{
data: {
id: 'n15'
}
},
{
data: {
id: 'n16'
}
}
],
edges: [{
data: {
source: 'n0',
target: 'n1'
}
},
{
data: {
source: 'n1',
target: 'n2'
}
},
{
data: {
source: 'n1',
target: 'n3'
}
},
{
data: {
source: 'n2',
target: 'n7'
}
},
{
data: {
source: 'n2',
target: 'n11'
}
},
{
data: {
source: 'n2',
target: 'n16'
}
},
{
data: {
source: 'n3',
target: 'n4'
}
},
{
data: {
source: 'n3',
target: 'n16'
}
},
{
data: {
source: 'n4',
target: 'n5'
}
},
{
data: {
source: 'n4',
target: 'n6'
}
},
{
data: {
source: 'n6',
target: 'n8'
}
},
{
data: {
source: 'n8',
target: 'n9'
}
},
{
data: {
source: 'n8',
target: 'n10'
}
},
{
data: {
source: 'n11',
target: 'n12'
}
},
{
data: {
source: 'n12',
target: 'n13'
}
},
{
data: {
source: 'n13',
target: 'n14'
}
},
{
data: {
source: 'n13',
target: 'n15'
}
},
]
},

layout: {
name: 'dagre',
padding: 5
}
});
cy.unbind('click');
cy.bind('click', 'node', function(evt) {
var edges = cy.collection();
var dfs = cy.elements().dfs({
roots: `#${evt.target.id()}`,
visit: function(v, e, u, i, depth) {
console.log('visit ' + v.id());
if (e) edges = edges.add(e);
},
directed: false
});

console.log(dfs);
cy.remove(edges);
});
body {
font: 14px helvetica neue, helvetica, arial, sans-serif;
}

#cy {
height: 100%;
width: 100%;
left: 0;
top: 0;
float: left;
position: absolute;
}
<html>

<head>
<meta charset=utf-8 />
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, minimal-ui">
<script src="https://unpkg.com/cytoscape@3.3.0/dist/cytoscape.min.js">
</script>
<script src="https://unpkg.com/jquery@3.3.1/dist/jquery.js"></script>
<!-- cyposcape dagre -->
<script src="https://unpkg.com/dagre@0.7.4/dist/dagre.js"></script>
<script src="https://cdn.rawgit.com/cytoscape/cytoscape.js-dagre/1.5.0/cytoscape-dagre.js"></script>
</head>

<body>
<div id="cy"></div>
</body>

</html>

关于javascript - 删除在 DFS 算法 cytoscape JS 中发现的边缘,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54064453/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com