Home:ALL Converter>How to represent a JSON structure as an organizational tree in HTML?

How to represent a JSON structure as an organizational tree in HTML?

Ask Time:2019-07-03T20:22:34         Author:Coolis

Json Formatter

I have a nested json object which represents a one to many relationship between a parent node and its children. I want to represent this json as an organizational chart in HTML. I found that I can use Google Charts to do it but I am not sure if Google Charts give you the ability to design the boxes or do any modifications on the design.

Does anyone know any resources that I can study?

This is the json object I have constructed:

{ 'id': 1,
  'name': 'Parent Node',
  'description': 'First Parent Node',
  'children': [
  {
      'id': 2,
      'name': 'child1',
      'description': 'child1',
      'children': [
      {
          'id': 4,
          'name': 'grand1',
          'description': 'grand1',
          'children': []
       }]
   },
   {
       'id': 3,
       'name': 'child2',
       'description': 'child2',
       'children': []
   }]
 }

This question Representing Binary Tree Structure in Web browser is also similar, but the link does not seem to work.

Author:Coolis,eproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/56870075/how-to-represent-a-json-structure-as-an-organizational-tree-in-html
Mr. X :

Here is the working version of the link from the other question that you mentioned: http://experiments.wemakesites.net/css3-treeview-with-multiple-node-selection.html",
2019-07-03T12:29:45
yy