10

これを行うための本当にシンプルでエレガントな方法があると確信していますが、それを理解することはできません。次のような入力データがあります。

[
{id: 1, name: "Peter"},
{id: 2, name: "Paul", manager: 1},
{id: 3, name: "Mary", manager: 1},
{id: 4, name: "John", manager: 2},
{id: 5, name: "Jane", manager: 2}
]

可能であれば、d3.js ネスト演算子を使用して、階層レイアウトで使用する構造を取得したいと考えています。このような：

[ 
   {name: "Peter", children: [
          {name:"Paul", children: [
              {name:"John"},
              {name:"Jane"}
          ]},
          {name:"Mary"}
      ]
   }
]
4

1 に答える 1

15

ネストによって固定階層が生成されるため、ここではネスト演算子を使用できません。出力階層のレベル数は、指定したキー関数の数と同じです。

つまり、ツリーを生成する独自の関数を作成できます。ルート ノードが入力配列の最初のノードであると仮定すると、id からノードへのマップを作成し、ツリーを遅延して構築できます。

function tree(nodes) {
  var nodeById = {};

  // Index the nodes by id, in case they come out of order.
  nodes.forEach(function(d) {
    nodeById[d.id] = d;
  });

  // Lazily compute children.
  nodes.forEach(function(d) {
    if ("manager" in d) {
      var manager = nodeById[d.manager];
      if (manager.children) manager.children.push(d);
      else manager.children = [d];
    }
  });

  return nodes[0];
}

マネージャーがレポートの前に表示されるような順序でノードがリストされていることがわかっている場合は、コードを単純化して 1 回だけ繰り返すことができます。

于 2012-08-14T03:45:25.590 に答える