帶有退化樹的d3徑向樹錯誤

Question

我正在構建一個使用d3的放射狀樹顯示樹的程序（ http://bl.ocks.org/mbostock/4063550 ）。 我無法控制傳入的樹。 我有一個問題，如果傳入的樹只有一個節點（根），那么我會得到如下錯誤：

Error: Invalid value for <g> attribute transform="rotate(NaN)translate(0)"

如果根只有一個孩子，我會遇到更多錯誤，依此類推（例如節點的單鏈接列表）。 這是兩個節點的錯誤：

Error: Invalid value for <path> attribute d="MNaN,NaNCNaN,NaN NaN,NaN NaN,NaN"
Error: Invalid value for <g> attribute transform="rotate(NaN)translate(0)"
Error: Invalid value for <g> attribute transform="rotate(NaN)translate(180)"
Error: Invalid value for <g> attribute transform="rotate(NaN)translate(360)"

問題似乎是該節點的x值設置為NaN。 有誰知道修復此問題？

Answer 1

我在分離功能中實現了您的a.depth修復，它似乎可以正確繪制： http : //jsfiddle.net/1Ljaajpf/1/

var tree = d3.layout.tree()
.size([360, diameter / 2 - 80])
.separation(function(a, b) { 
    // Added protection for degenerate case of one child
    if (a.depth == 0)
       return 1;

  return (a.parent == b.parent ? 1 : 10) / a.depth; 
});

也許您的代碼中還有其他原因導致繪制孩子失敗？ 例如，平移/旋轉/縮放功能存在問題，可能導致子節點移出可見區域（或子節點太小）