包装布局上的填充和边距

Question

简介

我一直在使用圆形打包布局搜索关于填充/边距应用的 StackOverflow ，但没有找到任何答案的有用问题。

我拥有什么

我的包装布局中有圆圈，如下所示：

输入的圈子由：

呈现

var selection = child.datum(data).selectAll(".node")
    .data(pack.nodes, function(d) {
      return d.name;
    });

var newG = enter
    .append("g")
    .classed("node", true)
    .attr("transform", function(d) {
      return translate(d.x, d.y);
    });

  newG
    .append("circle") // Outer circle
    .attr("r", function(d) { return 0; })
    .style("fill", "green")
    .append("circle") // Inner circle
    .attr("r", function(d) {
      return d.r - (d.r / 10); // Border is 10% of the circle radius
    });

期望

增加第一个圆的半径不会起作用。我真的没有尝试过这么多东西，因为我不知道应该为此尝试什么。所有circle元素都以g为基础，但增加g元素的翻译会导致其他元素的位置误入歧途。我在那里增加的所有东西只会增加圆圈及其子元素的比例，但是必要的是它们之间的填充。我有一个基本的working demo here。

问题

是否有一种简单的方法可以在包装布局或内置功能上应用填充/边距？。

被修改

使用内置pack.padding()会将圆圈彼此移开。这部分地解决了问题，但是圆圈已经到达了父母。这是一个内心空间：

提前致谢。

Answer 1

你可以通过pack.padding()获得一些方法。这不会改变孩子与父母的距离 - 这在D3中是不受支持的。

我已经实施了margin参数来执行此操作并提交了pull request，所以希望它很快就会推出。