d3 js可展開和可摺疊的樹形結構

Question

我正在嘗試生成可展開和可摺疊的水平樹形結構來顯示某些組的執行時間。

這裏是我的數據

組別1 的結構 - 採取 時間 - - Artifact1 Artifact2 - 執行 所用的時間。 。 。 組2 - 神器3 - 花費的時間 - 神器4 - 花費的時間 。 。 。

理想情況下，我希望將所有組顯示爲矩形，並且當用戶單擊一個矩形（組）時，它應該展開所有工件。

我期待到這個例子：https://github.com/lbrucher/d3-tree-heatmap：

這個例子的問題是，當我有更多的組，頁面瘋狂擴張和內部標籤盒消失。此外，我有大約30組這樣想顯示每行4或5盒

一些能幫助我在這個問題上

Answer 1

也許你可以創建一個你想要的樹的兩個圖提供了一些建議：

• 一個清楚顯示的所有標籤，但不適合在屏幕（其寬度比屏幕的寬度更大的）：

• 另一個適合在屏幕上，但不顯示標籤。

然後你允許用戶向下滾動第二個圖中，類似這樣的example：（ofcourse，你的情況，圖表會另眼相看）

---