How to use JSON data with bootstrap tree?
<p>I'm trying to use bootstrap tree for JSON data. I generate JSON data like this:</p>

<pre><code>var newData = [

                {
                    "resName": "LYS",
                    "atoms": [

                            {
                                "atomName": "N",
                                "x": 37.995,
                                "y": 20.521,
                                "z": 9.231
                            },
                            {
                                "atomName": "CA",
                                "x": 38.067,
                                "y": 19.342,
                                "z": 10.141
                            }

                        ]
                }
...
            ];
</code></pre>

<p>At the end of the code I expect a result like this:</p>

<p><img src="https://i.stack.imgur.com/VmDSA.png" alt="Here is the expected result"></p>

<p>But <a href="http://jonmiles.github.io/bootstrap-treeview" rel="nofollow noreferrer">http://jonmiles.github.io/bootstrap-treeview</a> codes use the data like this:</p>

<pre><code>var defaultData = [
              {
                text: 'Parent 1',
                href: '#parent1',
                tags: ['4'],
                nodes: [
                  {
                    text: 'Child 1',
                    href: '#child1',
                    tags: ['2'],
                    nodes: [
                      {
                        text: 'Grandchild 1',
                        href: '#grandchild1',
                        tags: ['0']
                      },
                      {
                        text: 'Grandchild 2',
                        href: '#grandchild2',
                        tags: ['0']
                      }
                    ]
                  },
                  {
                    text: 'Child 2',
                    href: '#child2',
                    tags: ['0']
                  }
                ]
              },
              {
                text: 'Parent 2',
                href: '#parent2',
                tags: ['0']
              }
            ];
</code></pre>

<p>Can I use resName or atoms instead of text? Or can I do anything to reach my expected result? I didn't find anything about it.</p>