在初始子节点之间创建路径 - D3树布局

时间:2015-10-25 18:13:38

标签: javascript d3.js

我正在使用D3 Collapsible Tree Layout并且想要创建一个从第一个子节点开始并一直移动到最后一个初始子节点的路径,同时在缩放/更新图形时将其标定为主要位置。基本上这就是我要去的地方

enter image description here

到目前为止我已经尝试过了:

cosmos -> World

但是我不确定如何让它在update()函数中正确转换,它也会在根节点下创建额外的路径,最终看起来像这样:

enter image description here

有什么想法吗?

更新:如果我抓住数据数组的var nodes = tree.nodes(root).reverse(); /** * transition logic, etc **/ var rootNodes = [ nodes[0], nodes[1] ]; //will use first 2 nodes as an example (will want to include all initial root nodes) var lineFunction = d3.svg.line('step') .x(function(d) { return d.y; }) .y(function(d) { return d.x; }) .interpolate("linear"); var lineGraph = vis.append("path") .attr("d", lineFunction(nodes)) .attr("stroke", "#ccc") .attr("stroke-width", "1.5") .attr("fill", "none"); } ,我可以将新路径保存在树的第一个子节点中

root

0 个答案:

没有答案