Dagre 樹狀圖

這個範例展示如何將 dagre.js 與 React Flow 整合，以建立簡單的樹狀佈局。dagre 的良好替代方案是 d3-hierarchy 或 elkjs，如果您正在尋找更進階的佈局函式庫。

export default function App() {
  const data: string = "world"

  return <h1>Hello {data}</h1>
}

這個範例是靜態佈局的示範。如果圖中的節點或邊緣發生變化，佈局不會重新計算！不過，可以使用 dagre (和其他函式庫) 進行動態佈局：請參閱 自動佈局 pro 範例，以取得相關範例。