javascript - 用节点和边建模一个简单的图形。

Question

我正在尝试使用 d3.js 可视化图表。我尝试了两种布局，bundle-radial 和 force。

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

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

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

Answer 1

如果不需要模拟，可以静态使用force布局。调用后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();

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

// 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仍然允许交互式探索。