Is there a simple library that will render JSON objects as trees?

Question

So, is there a VERY simple library that will render JSON objects as trees? I know that this can be done in many ways (such as YUI), but for debug purposes I'd like to simply be able to view a JSON objects I receive from a server as a tree, nothing fancy (but collapsable tree's would be a bonus).

The kind of solution I'm looking for would be something like:

<script source="something.js"/>
<script>
   obj ={"hello":"world"}
   lib.renderJSON("someid",obj);
</script>
...    
<div id="someid"/>

Any ideas?

Solution 1

check this too: http://jquery.bassistance.de/treeview/demo/async.html

Solution 2

As this thread came up in response to a Google search, thought it might be worth adding in what I found (the other link no longer appears valid in this context, but I could have missed some functionality).

There are a few around, but I did not find one that provided it in a "graphical tree view", rather a simple "text tree view". There were titled as "beautifiers" or "easy read" JSON viewers.

I ended up using: jsonview by yesmeck

Nice and simple, and did the job first time.

Solution 3

use D3 it is very easy to load json data just something like this

         d3.json("flare.json", function(error, flare) {
              flare.x0 = 0;
               flare.y0 = 0
               update(root = flare);
           });

Comments

[Bhargav Rao]

Whilst this may theoretically answer the question, it would be preferable to include the essential parts of the answer here, and provide the link for reference.

[ADJenks]

This doesn't display anything. All it does is fetch a json file: github.com/d3/d3-fetch/blob/master/README.md#json