简体   繁体   English

D3径向力布局

[英]D3 radial force layout

I am working on a d3 force layout which requires the nodes to be placed in such a way that there is a central node according to which all the other nodes are radially placed.The nodes are linked to each other like a normal force layout with appropriate source and target. 我正在研究一种d3力布局,它需要放置节点,使得有一个中心节点,根据该节点,所有其他节点都是径向放置的。节点相互链接,就像正常的力布局一样。来源和目标。 The central node is dictating the position of all the other nodes, so essentially it is the source of all the nodes. 中心节点指示所有其他节点的位置,因此基本上它是所有节点的源。 Right now all I have been able to manage to do is to place them in a linear fashion using the linkDistance property with one node as the reference, but I need it in a radial manner. 现在我所能做的就是使用linkDistance属性以一个节点作为参考以线性方式放置它们,但我需要它以径向方式。 I could have shown an image but apparently my reputation is too low and I am not being allowed to post one.Can someone help me out with this? 我本来可以展示一张图片,但显然我的声誉太低了,而且我不被允许发布一张图片。有人可以帮我解决这个问题吗?

Take a look at this example: 看看这个例子:

link to jsfiddle 链接到jsfiddle

在此输入图像描述

Central (root) node has special treatment that makes it always remain in the center of the graph. 中央(根)节点具有特殊处理,使其始终保持在图形的中心。 On initialization, central node's property fixed is set to true, so that d3 force layout simulation doesn't move it. 在初始化时,中心节点的fixed属性设置为true,因此d3强制布局模拟不会移动它。 Also, it is placed in the center of rectangle containing layout: 此外,它被放置在包含布局的矩形的中心:

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

Hope this helps. 希望这可以帮助。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM