WebPage上的分層結構表示

Question

我正在研究一些問題，主題是找到一種合適的方式來表示簡單網頁上的分層結構。精度：這是一個巨大的數據量。

讓有一定的語境化第一： 讓說你有一個它是由個省公司，包含幾個員工...

什麼是常用的有：

樹架構：

但我不喜歡它，因爲如果你有大量的數據，擴大和崩潰，如果你正在尋找幾個對象，它可能會很棘手......

圈模式：

和節點模式：

一個功能，我認爲可以幫助

2其他可能帶來一定的靈活性的方法最終用戶是一個彈性搜索欄，但這裏的目標是帶來一些靈活性用戶可以瀏覽結構。

我想使用JSF，但技術在這裏並不重要，這是一個概念階段。

請分享您的觀點，想法，創意...？

Answer 1

聽起來像是你在尋找樹繪圖算法。讓我舉一個簡短的概述：

在繪製圖形，你基本上可以通過三組特性的描述繪製：

• 你繪製慣例，即如何節點和邊緣在您的可視化中呈現。可能的選擇是：

  • 代表你的節點作爲點，您的邊緣作爲非相交曲線它們之間。
    這可能是由例如，要求將點放置在規則的網格上，在根周圍的同心圓上或類似的東西上。此外，您可能需要邊緣爲直線，圓形參數，...
    這可能是您在談論樹可視化時首先想到的。
  • 將您的節點表示爲矩形，通過嵌套矩形隱含您的邊。這通常被稱爲樹狀圖

• 一些美學要優化，即

  • 邊緣之間最大化的角度
  • 儘量減少該地區的樹需要
  • 如果建立基於樹的物理模型，請儘量減少潛在能量（請參閱Wikipedia：Force-directed graph drawing）
    ...

• 您也可以放置一些約束您的節點或邊緣，例如上將某些節點固定到某個位置，強化某些邊緣長度或類似的想法。

現在，我已經解釋了基礎知識，讓我列出一些方法：

• 正如你已經表明，在基於圈時尚，無論是通過將根在吸取你的樹中心和兒童在根周圍的同心圓中，或者圍繞它以圓形方式對齊節點的所有子樹。這些在GraphViz工具實現爲circo和twopi
• 使用HV佈局類似的樹視圖主要是具有水平和垂直邊緣粘，但允許多一點自由子樹安置
• 使用任意的，其操作水平的角度來看，即根被放置在頂部的許多直線繪圖技術，其子女的下一級，...
• 代表你的樹作爲一個樹狀圖相似上面的例子。

如果不是所有的這些技術描述並在手冊圖形圖像的可視化和通過等Tassima的Tree-drawing chapter可視化。人。