Question

来自d3.js示例http://bl.ocks.org/mbostock/1093025

我想使用tree.size来指定树的宽度，但我发现子项的默认缩进太大了。如文档中所述，[如果我使用tree.nodeSize它将取消tree.size的效果] [1]：＆＃34; nodeSize属性是tree.size独有的;设置tree.nodeSize将tree.size设置为null。＆＃34;

var tree = d3.layout.tree()
//.nodeSize([1, 20]);
.size([10, 300]);

为了清晰起见，我创建了一个自定义jsfiddle：http://jsfiddle.net/orrw9p1k/1/

你可以看到第一个孩子就在右边。我希望它距左侧最大约20像素，但是当我部署“分析”时，我不希望树能够超过其宽度。节点

如何才能充分利用两个世界？

更新：这是一个有效的例子： http://jsfiddle.net/mneom9bf/

Answer 1

假设我正确理解了您的问题，您可以通过＆＃34;规范化深度来实现这一目标。对于每个节点。

nodes.forEach(function(d) { d.y = d.depth * 100; });

只需在您的评论// Compute the "layout"附近添加此内容，然后使用值100来获取您想要的内容。

编辑：您还可以使用var width设置树大小，然后将{ d.y = d.depth * 100; }更改为{ d.y = d.depth * width/someNumber; }，使其取决于整体树大小

D3.js固定宽度树，缩进有限

1 个答案: