使 Cytoscape.js 节点成为链接

Question

我正在使用 cytoscape.js 制作一个简单的图形网络。我希望每个节点都包含一个 href 以链接到更多信息，或者在悬停时也显示信息。是否可以将此功能添加到 cytoscape 节点？

Answer 1

首先，将 href 添加到 data 标签。像这样：

{ data: { id: 'c' , href: 'example.com'} }

然后将其插入脚本中：

cy.on('tap', 'node', function(){
  try { // your browser may block popups
    window.open( this.data('href') );
  } catch(e){ // fall back on url change
    window.location.href = this.data('href');
  }
});     

Answer 2

您可以在生成节点时添加信息，例如：

data: {id: 'nodeName', label: 'nodeLabel', link: 'your_href'}

然后您可以使用qtip显示所述链接或仅将其作为标签的一部分。

data(link)您可以使用标签或this.data("link")qtip来调用每个节点的链接：

{selector: 'edge', style: {'label': 'data(link)',}}