Represent a tree layout using D3

Question

I'm trying to use D3 to create a tree layout. I want to modify the standard d3 tree layout to represent a tree layout like following. In my layout, some of the child nodes can be converged into one node. It is the only difference between that layout and the standard tree layout.

     A
   /   \
  B     C
 /\ \   
D  E F
|  | |
G  H L
 \ // 
  J
  |
  K

In the above layout B node has 3 children(D,E,F) and each has one child node (G,H,L) and those 3 children again converge into one node (J).

I can use a javascript library other than D3 also.

score 0 · Answer 1 · answered Jul 19 '15 at 11:49

0

The right way would be to use d3.layout.force instead of d3.layout.tree.

However, if you want a tree layout solution, you might want to check out http://bl.ocks.org/robschmuecker/6afc2ecb05b191359862

answered Jul 19 '15 at 11:49

potatopeelings

40,709
7
95
119

Blind Owl · Answer 2 · 2015-07-31T08:27:48.267

0

I had a big long answer, but just if anyone actually searches this question here. D3-Dagre

edited Jul 31 '15 at 08:27

answered Jul 19 '15 at 20:39

Blind Owl

21
1
6

Represent a tree layout using D3

2 Answers2