d3 V4 d3.stratifyはツリーとどのように動作しますか？

Question

私はD3で簡単な組織図を視覚化しようとしています。私は小さなテストを行い、階層化されたデータは "ツリー"メソッドと呼ばれても機能しません。私がデバッグすると、stratifyが必要なエントリを「ルート」に入れなかったように見えます（thisなどの他の例を実行してデバッグしましたが、存在しない子/親エントリの集合鉱山で）。

test.json：

{"orgchart":[ 
{"EmployeeName":"TO","Manager":"","Team":"My Company","JobRole":"Something Cool"}, 
{"EmployeeName":"JW","Manager":"TO","Team":"My Company","JobRole":"Something Cool"}, 
{"EmployeeName":"BK","Manager":"JW","Team":"Team 1","JobRole":"Something Cool"}, 
{"EmployeeName":"WH","Manager":"BK","JobRole":"Something Cool"}, 
{"EmployeeName":"SE","Manager":"BK","JobRole":"Something Cool"}, 
{"EmployeeName":"QI","Manager":"BK","JobRole":"Something Cool"}, 
{"EmployeeName":"KX","Manager":"BK","JobRole":"Something Cool"}, 
{"EmployeeName":"KA","Manager":"KX","JobRole":"Something Cool"}, 
{"EmployeeName":"HH","Manager":"JW","Team":"Team 2","JobRole":"Something Cool"}, 
{"EmployeeName":"DN","Manager":"HH","JobRole":"Something Cool"}, 
{"EmployeeName":"KT","Manager":"HH","JobRole":"Something Cool"}, 
{"EmployeeName":"JB","Manager":"KT","JobRole":"Something Cool"}, 
{"EmployeeName":"UM","Manager":"KT","JobRole":"Something Cool"}, 
{"EmployeeName":"AL","Manager":"KT","JobRole":"Something Cool"}, 
{"EmployeeName":"FR","Manager":"KT","JobRole":"Something Cool"}, 
{"EmployeeName":"WE","Manager":"HH","JobRole":"Something Cool"}, 
{"EmployeeName":"CO","Manager":"WE","JobRole":"Something Cool"}, 
{"EmployeeName":"LE","Manager":"WE","JobRole":"Something Cool"}, 
{"EmployeeName":"LO","Manager":"WE","JobRole":"Something Cool"}, 
{"EmployeeName":"YI","Manager":"HH","JobRole":"Something Cool"}, 
{"EmployeeName":"EI","Manager":"YI","JobRole":"Something Cool"}, 
{"EmployeeName":"DJ","Manager":"YI","JobRole":"Something Cool"}, 
{"EmployeeName":"SH","Manager":"YI","JobRole":"Something Cool"}, 
{"EmployeeName":"BS","Manager":"JW","Team":"Team 2","JobRole":"Something Cool"}, 
{"EmployeeName":"SP","Manager":"BS","JobRole":"Something Cool"}, 
{"EmployeeName":"SB","Manager":"JW","Team":"Team 3","JobRole":"Something Cool"}, 
{"EmployeeName":"GQ","Manager":"SB","JobRole":"Something Cool"}, 
{"EmployeeName":"JS","Manager":"GQ","JobRole":"Something Cool"}, 
{"EmployeeName":"HT","Manager":"SB","JobRole":"Something Cool"}, 
{"EmployeeName":"MB","Manager":"HT","JobRole":"Something Cool"}, 
{"EmployeeName":"MF","Manager":"HT","JobRole":"Something Cool"}, 
{"EmployeeName":"FW","Manager":"SB","JobRole":"Something Cool"}, 
{"EmployeeName":"GM","Manager":"FW","JobRole":"Something Cool"}, 
{"EmployeeName":"XT","Manager":"FW","JobRole":"Something Cool"}, 
{"EmployeeName":"VQ","Manager":"FW","JobRole":"Something Cool"}]} 

テストコード：もちろん

var tree = d3.tree().size([height, width - 160]); 
d3.json("test.json", function(error, data) { 
    if (error) throw error; 
    // a breakpoint here shows data loaded and valid 
    var root = d3.stratify(data.orgchart) 
      .id(function(d) { return d.EmployeeName; }) 
      .parentId(function(d) { return d.Manager; }); 

    // a breakpoint here shows no children/parent entries in "root" 
    // so the next function fails with 
    // "Uncaught TypeError: root.eachBefore is not a function" 

    tree(root); 
}); 

Answer 1

日以上のためにこれを見た後は、5分、私の質問を投稿した後、私は答えを実現しました。

データが間違って渡されました。

の代わりにこの：

var root = d3.stratify(data.orgchart) 
     .id(function(d) { return d.EmployeeName; }) 
     .parentId(function(d) { return d.Manager; }); 

それはこのようになります。

var root = d3.stratify() 
     .id(function(d) { return d.EmployeeName; }) 
     .parentId(function(d) { return d.Manager; }) 
     (data.orgchart); 

"data.orgchart" は、鎖の最後に置かれる必要があります。