コンテンツへスキップ

ツリー

/Chaos /Chaos/Eros /Chaos/Erebus /Chaos/Tartarus /Chaos/Gaia /Chaos/Gaia/Mountains /Chaos/Gaia/Pontus /Chaos/Gaia/Uranus Eros/Chaos/Eros Erebus/Chaos/Erebus Tartarus/Chaos/Tartarus Mountains/Chaos/Gaia/Mountains Pontus/Chaos/Gaia/Pontus Uranus/Chaos/Gaia/Uranus Chaos/Chaos Gaia/Chaos/Gaia

· ツリーレイアウトは、Reingold–Tilford の「tidy」アルゴリズムを使用して、ツリーのすっきりとしたノードリンク図を生成します。これはBuchheim によって線形時間で実行できるように改善されています。 tidy ツリーは通常、デンドログラムよりもコンパクトです。

tree()

ソース · デフォルト設定で新しいツリーレイアウトを作成します。

tree(root)

ソース · 指定された root 階層をレイアウトし、rootとその子孫に次のプロパティを割り当てます。

  • node.x - ノードの x 座標
  • node.y - ノードの y 座標

座標 xy は任意の座標系を表します。たとえば、x を角度として、y を半径として扱うことで、放射状レイアウトを作成できます。ツリーレイアウトに階層を渡す前に、root.sort を呼び出すことをお勧めします。

tree.size(size)

ソース · size が指定されている場合、このツリーレイアウトのサイズを指定された2要素の数値配列 [width, height] に設定し、このツリーレイアウトを返します。size が指定されていない場合は、現在のレイアウトサイズを返します。デフォルトは [1, 1] です。レイアウトサイズが null の場合、代わりに ノードサイズ が使用されることを示します。座標 xy は任意の座標系を表します。たとえば、放射状レイアウトを作成するには、[360, radius] のサイズが 360° の幅と radius の深さに対応します。

tree.nodeSize(size)

ソース · size が指定されている場合、このツリーレイアウトのノードサイズを指定された2要素の数値配列 [width, height] に設定し、このツリーレイアウトを返します。size が指定されていない場合は、現在のノードサイズを返します。デフォルトは null です。ノードサイズが null の場合、代わりに レイアウトサイズ が使用されることを示します。ノードサイズが指定されている場合、ルートノードは常に ⟨0, 0⟩ に配置されます。

tree.separation(separation)

ソース · separation が指定されている場合、分離アクセサを指定された関数に設定し、このツリーレイアウトを返します。separation が指定されていない場合は、現在の分離アクセサを返します。デフォルトは次のようになります。

js
function separation(a, b) {
  return a.parent == b.parent ? 1 : 2;
}

放射状レイアウトにより適したバリエーションは、半径に比例して分離ギャップを減らします。

js
function separation(a, b) {
  return (a.parent == b.parent ? 1 : 2) / a.depth;
}

分離アクセサは、隣接するノードを分離するために使用されます。分離関数には2つのノード ab が渡され、目的の分離を返す必要があります。ノードは通常は兄弟ですが、レイアウトがそのようなノードを隣接して配置することにした場合、ノードはより遠く離れた関係にある可能性があります。