使用节点和边建模一个简单的图。

时间:2012-04-11 06:09:15

标签: javascript d3.js

我试图使用d3.js可视化图形。我尝试了两种布局,束径向和力。

Bundle-radial不起作用,因为每个节点都需要父节点,并且它不适合图形可视化。

对于强制布局,脚本会挂起。也许是因为这个图中有很多节点和边。此外,我不需要力布局附带的模拟。

我可以尝试使用d3.js中的其他布局吗?

1 个答案:

答案 0 :(得分:4)

如果您不需要模拟,则可以静态使用力布局。致电force.start后,请致电force.tick若干次,然后force.stop停止模拟:

// Run the layout a fixed number of times.
// The ideal number of times scales with graph complexity.
// Of course, don't run too long—you'll hang the page!
force.start();
for (var i = n; i > 0; --i) force.tick();
force.stop();

在某些情况下,可能有助于确定性地初始化节点位置,以鼓励模拟快速收敛于良好的解决方案。如果你没有初始化位置,力布局会随机初始化它们,所以它可能有点不可预测。例如,这里我沿对角线初始化节点:

// Initialize the positions deterministically, for better results.
var n = nodes.length;
nodes.forEach(function(d, i) { d.x = d.y = width / n * i; });

最后,如果您使用的是静态布局,请考虑使用fisheye distortion仍允许进行交互式探索。