D3如何为强制定向地图创建星形布局？

Question

我可以构建一个默认的力导向图，我也可以构建一个树形图。但我要求建立一个星形网络拓扑图。我不知道如何去做，因为我似乎无法找到这样做的指南。如果有人能指出我的方向或某些资源，我将非常感激。谢谢。

我用于渲染树形拓扑的代码如下所示：

            var k = 6 * e.alpha;
            graph.links.forEach(function(d, i) {
              d.source.y -= k;
              d.target.y += k;
            });
            node.attr("cx", function(d) { return d.x; })
                .attr("cy", function(d) { return d.y; });
            link.attr("x1", function(d) { return d.source.x; })
                .attr("y1", function(d) { return d.source.y; })
                .attr("x2", function(d) { return d.target.x; })
                .attr("y2", function(d) { return d.target.y; });

这是我想要渲染的内容。

Answer 1

看一下这个例子：

link to jsfiddle

如果检查代码，您将看到根节点具有特殊处理，使其始终保持在图形的中心。如果你不需要或没有这样的节点，你可以“发明”它，而不是显示它，但仍然有它用于运行力布局以获得剩余节点的星形排列。

在初始化时，root的属性fixed设置为true，因此d3强制布局模拟不会移动它。此外，它位于包含布局的矩形的中心：

root.fixed = true;
root.x = width / 2;
root.y = height / 2;

当然，您需要更改或添加一些代码，以便更改每个圆的颜色以依赖于特定的某些其他属性，但核心布局的想法在我链接的示例中。

希望这会有所帮助。如果您有疑问，需要澄清等，请告诉我。