可以在固定圆圈尺寸的d3.js中使用圆形包装布局吗？

Question

这个圈子包布局示例（http://bl.ocks.org/4063269）非常适合我正在处理的项目，但它会相对于彼此调整所有圈子的大小：

是否有一种简单的方法为每个圆圈指定固定半径？

我已经搜索过源代码，示例，google和stackoverflow，似乎找不到任何有用的东西。

圆圈的确切尺寸对我很重要。

Answer 1

可行，简单的事情。第一个答案是准确的，但我相信我的更简单，更明确，所以我也附上它。

请看一下这个例子：jsfiddle

按＆＃34;常数＆＃34;按钮，你会看到这样的东西：

关键代码行是：

    pack.value(function(d) { return 100; })

这将使圆半径始终与数据有关。 100当然可以是任何常数。您可以在circle pack初始化中应用此行（很可能是您的情况），或重新初始化（如我的示例中所示）。

希望这有帮助。

Answer 2

如果您按照您提供的示例中的代码进行操作，则<circle>元素的大小将在此处决定：

node.append("circle")
  .attr("r", function(d) { return d.r; })
// ...

要将圈子的大小修改为50，您可以执行以下操作：

node.append("circle")
  .attr("r", function(d) { return 50; })
// ...

---

更新

然而，这将打破评论中指出的布局。要解决这个问题，可以为每个节点提供相同的value：

// Returns a flattened hierarchy containing all leaf nodes under the root.
function classes(root) {
  var classes = [];

  function recurse(name, node) {
    if (node.children) node.children.forEach(function(child) { recurse(node.name, child); });
    else classes.push({packageName: name, className: node.name, value: node.size});
  }

  recurse(null, root);
  return {children: classes};
}

为：

// Returns a flattened hierarchy containing all leaf nodes under the root.
function classes(root) {
  var classes = [];

  function recurse(name, node) {
    if (node.children) node.children.forEach(function(child) { recurse(node.name, child); });
    else classes.push({packageName: name, className: node.name, value: 1});
  }

  recurse(null, root);
  return {children: classes};
}