Question

我已经创建了一个集群树布局，我想为所选节点添加自定义节点样式。更准确地说，我将树图添加为节点。

我设法添加了这些，但它们并不位于节点的中心。我已经尝试了各种x，y属性和翻译，但是我还没有得到svg那么多。

我添加节点的部分代码在这里（对于JSfiddle，见下文）：

nodeEnter.each(function(d) {
    if (d.status == "D") {
      var treemap = d3.layout.treemap()
        .size([20, 20])
        .sticky(true)
        .value(function(d) {
          return 1;
        });

      var cell = d3.select(this)
        .selectAll("g")
        .data(function(d) {
          return treemap.nodes(d.annotations);
        })
        .enter().append("g")
        .attr("class", "cell")
        .attr("transform", function(d) {
          return "translate(" + d.x + "," + d.y + ")";
        });

      cell.append("rect")
        .attr("width", function(d) {
          return d.dx;
        })
        .attr("height", function(d) {
          return d.dy;
        })
        .style("fill", function(d) {
          return d.children ? null : hex2rgb(color(d.parent.name));
        });
    }
 })

任何帮助将不胜感激

这是我的JSfiddle。

升。

Answer 1

假设您希望线条连接到附加矩形的中间。我刚刚给你的JSfiddle添加了第三个.attr

cell.append("rect")
        .attr("width", function(d) {
          return d.dx;
        })
        .attr("height", function(d) {
          return d.dy;
        })
        .attr("transform","translate(0,-10)")
        .style("fill", function(d) {
          return d.children ? null : hex2rgb(color(d.parent.name));
        });

如何在树形布局中将路径定位到节点中心

1 个答案: