Visualize a nested JSON structure

Consider this JSON object:

{ department_1 : [{ id : 1, name = Joe Smith, email : jsmith@usf.edu}, ...., { id : 500, name = Bun Sam, email : bsam@usf.edu}]}
{ department_2 : [{ id : 1, name = Joe Smith, email : jsmith@usf.edu}, ...., { id : 500, name = Bun Sam, email : bsam@usf.edu}]}
{ department_3 : [{ id : 1, name = Joe Smith, email : jsmith@usf.edu}, ...., { id : 500, name = Bun Sam, email : bsam@usf.edu}]}
{ department_4 : [{ id : 1, name = Joe Smith, email : jsmith@usf.edu}, ...., { id : 500, name = Bun Sam, email : bsam@usf.edu}]}

Obviously, this is a nested data structure, and there are many records, in this example at the deepest level we have about 2000 records. what is the best way to visualize this responsively and interactively. I already used the table and it does not look so interactive. I am looking for ideas and approaches, and possibly some implementation examples, to visualize this with ease of use.

+4
source share
3 answers

Try the Fold Tree Layout with d3. (selected from their gallery )

They have a well documented example on the page.

0

Try Chart.js. You can find many examples and tutorials on the Internet.

Here is a link to the documentation http://www.chartjs.org/docs/

-1
source

All Articles