使用angular/d3/css3 /（？）通過動畫樹形圖創建體驗

Question

所以我有一個簡單的樹形圖，將其細分爲稍後可能會更改的類別。

這將是嚴格的ipad/chrome，所以不要擔心遺留問題。

我想分支（線）一種從每個類別（語音/視頻聊天）到以下節點成長（視頻羣聊，SKYPE等）。我非常肯定，畫布是實現這一點的最佳方式。節點和類別的數據將從angularJS中的javascript/json factory/model中獲取。堆棧中的任何人都可以幫助我制定一個解決方案，該解決方案可以對變化進行縮放，並使點擊和動畫變得過於簡單以適應快速變化

如果可能的話，在畫布領域的額外評論（我幾乎不知道什麼地方）。 這對我來說是一次搶先攻擊;所以，如果我要求太過抱歉。

Answer 1

D3可能是要走的路。它通常帶有陡峭的學習曲線（至少對我而言，之前沒有使用過SVG）。 Mike Bostock有一個類似的例子：http://bl.ocks.org/mbostock/4339083

節點是交互式的，有幾層嵌套。它是左右樹，而不是像你想要的那樣從上到下。所以它需要修改以獲得它想要的。

Mike Bostock的另一個例子是：http://bl.ocks.org/mbostock/999346。這是自上而下的。