单击节点时获取 cytoscape.js 中的边列表
Getting list of edges in cytoscape.js when clicking on a node
我正在尝试创建一个 cytoscape.js 图形,在该图形中单击节点将更改连接到该节点的任何边的颜色。我已经能够找到单独的组件,但无法让它们一起工作。我是 JavaScript 和 cytoscape.js 的新手,所以不要在您的回答中做出任何假设。
从示例中,可以注册鼠标单击事件,在本例中将节点的 ID 打印到控制台上。
cy.on('tap', 'node', function(evt){
var node = evt.cyTarget;
console.log( node.id() );
});
如果已知其纯文本 ID,则可以通过这种方式找到连接到特定节点的边:
cy.edges("[source = 'NodeTextId']")
最后,边的颜色可以更新为:
someEdge.animate({
css: {
'line-color': 'red'
}
})
我如何使用 cy.on()
鼠标单击事件来 return 一个值,该值可以与 cy.edges()
一起使用以获得可以迭代以更改颜色的边数组的边缘?
非常感谢!
使用nodes.connectedEdges()
让边连接到节点:http://js.cytoscape.org/#nodes.connectedEdges
您不需要 return 事件处理程序的边缘,您可以立即在事件处理程序中进行着色,如下所示:
cy.on("tap", "node", (evt) => {
evt.cyTarget.connectedEdges().animate({
style: {lineColor: "red"}
})
})
我正在尝试创建一个 cytoscape.js 图形,在该图形中单击节点将更改连接到该节点的任何边的颜色。我已经能够找到单独的组件,但无法让它们一起工作。我是 JavaScript 和 cytoscape.js 的新手,所以不要在您的回答中做出任何假设。
从示例中,可以注册鼠标单击事件,在本例中将节点的 ID 打印到控制台上。
cy.on('tap', 'node', function(evt){
var node = evt.cyTarget;
console.log( node.id() );
});
如果已知其纯文本 ID,则可以通过这种方式找到连接到特定节点的边:
cy.edges("[source = 'NodeTextId']")
最后,边的颜色可以更新为:
someEdge.animate({
css: {
'line-color': 'red'
}
})
我如何使用 cy.on()
鼠标单击事件来 return 一个值,该值可以与 cy.edges()
一起使用以获得可以迭代以更改颜色的边数组的边缘?
非常感谢!
使用nodes.connectedEdges()
让边连接到节点:http://js.cytoscape.org/#nodes.connectedEdges
您不需要 return 事件处理程序的边缘,您可以立即在事件处理程序中进行着色,如下所示:
cy.on("tap", "node", (evt) => {
evt.cyTarget.connectedEdges().animate({
style: {lineColor: "red"}
})
})