Question

我有一个简单的树形布局示例，我希望有源和＆amp;目标节点要设置值

数据是这样的：

   var Data = {"name" : "A", "info" : "tst", "childrens" : [
      {"name" : "A1", x:100, y:100 },
      {"name" : "A2", x:50, y:400 },
      {"name" : "A3", x:50, y:100 },
      {"name" : "A311", x:350, y:120 },
      {"name" : "A312", x:250, y:170 },
      {"name" : "A312", x:175, y:200 }

    ]};

正如您所看到的，我已经定义了x＆amp; y为每个节点赋值，将它们放在我想要的位置。

然而，它似乎对布局没有任何影响。

我试图将投影更改为：

            translate(" + d.x + "," + d.y + ")"

此外，我尝试更改节点变量，但它似乎具有相同的效果，就像我在投影上更改它一样。

我想知道是否可以使用treelayout设置位置并且不允许。

另外，我不想使用svg：circle，而是希望使用svg.symbol：

   node.append("path")
       .attr("d", d3.svg.symbol().type(circle))
       .attr("transform", "translate(0,0)")

然而，相反它只显示线条，没有文字 - 不明白为什么。

所以基本上我试图定位孩子们。我选择的根源。

任何帮助或建议都会有很大的帮助。 http://jsfiddle.net/3twUr/2/

编辑：

var line = d3.svg.diagonal（）。data（data）.enter（）

    .source({x: d.x, y: d.y})
    .target({x: d.x, y: d.y});

    svg.append("path")
        .attr("fill", "none")
        .attr("stroke", "black")
        .attr("d", line);

     var pos = [{source: "A" ,target: 'A1'},
                {source: "A" , target: 'A2'} ];

Answer 1

树布局（以及大多数其他布局）的重点在于它确定了节点的位置。你想要做的事情是完全不受支持的。

鉴于您已经拥有节点位置，听起来简单地将符号和线放置在您想要的位置会更容易。就是这样的事情

svg.selectAll("circle").data(Data.childrens)
   .enter()
   .append("circle")
   .attr("cx", function(d) { return d.x; })
   .attr("cy", function(d) { return d.y; });

对于链接，您需要自己计算。听起来你想将父节点链接到他们的孩子，所以这将是相对简单的。

此方法还具有以下优点：您可以自由使用任何所需的节点/链接样式。

预先确定树布局的x和y值

1 个答案: