控制D3圆组布局算法中圆的顺序

Question

我想知道是否可以在d3.layout中略微更改打包算法。也就是说，我想知道如果不是将一个具有最高值的子节点放在它接触父节点的位置，而是将它放在它的中间。现在，看起来所有的孩子都是螺旋状的，最小的孩子在父母的内心深处。

我希望它不会太混乱。我很乐意澄清一些不清楚的事情。

Answer 1

有可能。

您只需要在d3.js中替换此代码：

  function d3_layout_packSort(a, b) {
    return a.value - b.value;
  }

使用此代码：

  function d3_layout_packSort(a, b) {
    return -(a.value - b.value);
  }

（只是改变了标志）

最大的圆圈不会位于父母的正中心，但是它们往往靠近中心。我的理解是你不需要在中心准确放置，只需要近似，所以我希望这会满足你的想法。

下图显示了使用常规和修改后的d3.js并排获得的圆形包装示例：

我更喜欢改装包装。 :)所以我想这是一个好主意。检查数据的外观。

您可以在此处访问以下示例：regular，modified。

我修改过的d3.js是here。

如果您还有其他问题，请与我们联系。

Answer 2

D3是开源的，所以你可以做任何你喜欢的修改。对于包装布局，将元素放置在包含形状的中心可能需要进行相当广泛的修改，因为这样做会进一步限制可用空间。

也就是说，在边缘处有一个圆圈，其余的空间直到另一个边缘可以用于其他圆圈。如果圆圈位于中心，则直到边缘的空间较小，因此圆圈的空间较小。为了保持大小和数据之间的视觉关联，中心的圆必须更小，等等。

所以你所说的不是一个简单的修改，而是实现算法的改变。根据您正在尝试做的事情，使用D3的另一个布局可能更容易实现这一点。