Question

我有一个这样的无向图：

 var cy = cytoscape({
          container: document.getElementById('cy'),
          elements: [
            // nodes
            { data: { id: 'a' } },
            { data: { id: 'b' } },
            { data: { id: 'c' } },
            { data: { id: 'd' } },

            // edges
            {
              data: {
                id: 'ab',
                source: 'a',
                target: 'b'
              }
            },
            {
              data: {
                id: 'bc',
                source: 'b',
                target: 'c'
              }
            },
            {
              data: {
                id: 'cd',
                source: 'c',
                target: 'd'
              }
            }
          ],
          style: [
            {
              selector: 'node',
              style: {
                shape: 'hexagon',
                'background-color': 'red',
                label: 'data(id)'
              }
            }],
          layout: {
            name: 'grid'
          }
        });

如您所见，您可以使用d和a从c转到d。我想要实现的是，如果边缘ab突出显示，边缘bc和cd也会突出显示。有没有办法做到这一点？我无法在互联网上找到任何相关资料......谢谢。

Answer 1

查看包含的算法，例如Floyd-Warshall或Dijkstra。从它们的输出中，您应该能够为相关边缘生成突出显示。

实施例

var dijkstra = cy.elements().dijkstra('#an_id')
var path = dijkstra.pathTo( cy.elements('node#another_id'))

path.forEach(function(ele){
  if (ele.isEdge()){
    ele.addClass("class_that_has_highlight_styling")
  }
})

突出显示Cytoscape JS中的多个边缘

1 个答案: