自动调整d3树布局的节点宽度

Question

请根据d3树布局的节点值建议如何自动调整节点的宽度。

以下是我改编的链接参考和一段代码。

var margin = {
top: 20,
right: 120,
bottom: 20,
left: 120
},
width = 960 - margin.right - margin.left,
height = 800 - margin.top - margin.bottom;

http://jsfiddle.net/augburto/YMa2y/

Answer 1

我没有回答你的确切问题，但基本上你需要动态自动调整svg矩形的大小。我已使用以下代码更新了您的fiddle以根据子项数动态调整矩形大小：

> .attr("width", function (d,i) { if(d._children) console.log(rectW +
> d._children.length);
>         return d._children ? (rectW + d._children.length) : rectW; })

这只是将子项数量的长度添加到rectW中。对于您想要做的事情，您需要计算文本的长度并将其设置为矩形的宽度。 This question可能会帮助您计算文本的长度。您还必须重新计算矩形的中心以放置标签。

希望这能让你前进。

干杯