Cytoscapejs cose layput为所有节点

时间:2017-12-11 09:32:52

标签: javascript node.js cytoscape.js

我正在使用终端中的nodejs使用cytoscapejs编写一个简单的javascript。我的目标是获得给定节点和边列表和布局的所有节点的位置。我在代码下面运行:

var cytoscape = require('cytoscape');

var cy = cytoscape({

  elements: [ // list of graph elements to start with
    { // node a
      data: { id: 'a' }
    },
    { // node b
      data: { id: 'b' }
    },
    { // node b
      data: { id: 'c' }
    },
    { // node b
      data: { id: 'd' }
    },
    { // node b
      data: { id: 'e' }
    },
    { // node b
      data: { id: 'f' }
    },
    { // node b
      data: { id: 'g' }
    },
    { // node b
      data: { id: 'h' }
    },
    { // edge ab
      data: { id: 'ab', source: 'a', target: 'b' }
    },
    { // edge ab
      data: { id: 'bc', source: 'b', target: 'c' }
    },
    { // edge ab
      data: { id: 'cd', source: 'c', target: 'd' }
    },
    { // edge ab
      data: { id: 'de', source: 'd', target: 'e' }
    },
    { // edge ab
      data: { id: 'ef', source: 'e', target: 'f' }
    },
    { // edge ab
      data: { id: 'fg', source: 'f', target: 'g' }
    },
    { // edge ab
      data: { id: 'gh', source: 'g', target: 'h' }
    }
  ],

  style: [ // the stylesheet for the graph
    {
      selector: 'node',
      style: {
        'background-color': '#666',
        'label': 'data(id)'
      }
    },

    {
      selector: 'edge',
      style: {
        'width': 3,
        'line-color': '#ccc',
        'target-arrow-color': '#ccc',
        'target-arrow-shape': 'triangle'
      }
    }
  ],
  layout: {name: "cose",randomize: true}
});

cy.nodes().forEach(function(s){
    console.log(s.position().x)
    console.log(s.position().y)
});

当我看到位置的结果时,它为所有节点给出0。如果我使用其他类型的布局,它会给出除0以外的一些结果。如何正确使用cose进行布局?谢谢。

1 个答案:

答案 0 :(得分:1)

您正在运行连续/异步布局,并期望它像离散/同步布局一样完成。

等待布局完成。如果要在init处指定布局,请使用layout.on('layoutstop', () => { /* ... */ }),或者最好创建layout并绑定到layoutstop - 即<Config name="AppDownloadURLHost">%http%</Config>