Javascript VivaGraphJS中的圆形布局

Javascript VivaGraphJS中的圆形布局,javascript,layout,graph,graph-visualization,Javascript,Layout,Graph,Graph Visualization,我正在使用创建我的图形,它是动态的,并且在数据进来时不断更新。问题是默认情况下没有我需要的圆形布局 我偶然发现了我想在其中移植到VivaGraph。我不能完全理解为了有一个到VivaGraph的端口要做什么更改。如果你能帮助我并指导我度过难关,我将不胜感激。谢谢: 还有,我需要一个算法,因为交叉数对我来说并不重要 function CircularLayout(width, height) { this.width = width; this.height = height; } /*

我正在使用创建我的图形,它是动态的,并且在数据进来时不断更新。问题是默认情况下没有我需要的圆形布局

我偶然发现了我想在其中移植到VivaGraph。我不能完全理解为了有一个到VivaGraph的端口要做什么更改。如果你能帮助我并指导我度过难关,我将不胜感激。谢谢:

还有,我需要一个算法,因为交叉数对我来说并不重要

function CircularLayout(width, height)
{
  this.width = width;
  this.height = height;
}

/**
 * Spreads the vertices evenly in a circle. No cross reduction.
 *
 * @param graph A valid graph instance
 */
CircularLayout.prototype.layout = function(graph)
{
  /* Radius. */
  var r = Math.min(this.width, this.height) / 2;

  /* Where to start the circle. */
  var dx = this.width / 2;
  var dy = this.height / 2;

  /* Calculate the step so that the vertices are equally apart. */
  var step = 2*Math.PI / graph.vertexCount; 
  var t = 0; // Start at "angle" 0.

  for (var i = 0; i<graph.vertices.length; i++) {
    var v = graph.vertices[i];
    v.x = Math.round(r*Math.cos(t) + dx);
    v.y = Math.round(r*Math.sin(t) + dy);
    t = t + step;
  }
}

您可以使用常量布局并自行计算圆形布局的位置。下面的代码示例

var gen = new Viva.Graph.generator();
var graph = gen.balancedBinTree(5);
var layout = Viva.Graph.Layout.constant(graph);
var nodePositions = generateNodePositions(graph,200);
layout.placeNode(function(node) { return nodePositions[node.id-1];});
renderer = Viva.Graph.View.renderer(graph,{ layout : layout });
renderer.run();
renderer.reset();
function generateNodePositions(graph,radius) {
    var nodePositions=[];
    var n = graph.getNodesCount();
    for (var i=0; i<n; i++) {
        var pos = {
            x:radius*Math.cos(i*2*Math.PI/n),
            y:radius*Math.sin(i*2*Math.PI/n)
        }
        nodePositions.push(pos);
    }
    return nodePositions;
}