41–48 of 48 posts
Earlier quoted context omitted.
> Single file, 187 lines of JavaScript, no dependencies, does one thing and does it well. Even though I understood your point, a cursory glance suggests it only maps a JavaScript object to a SVG. Hardly something with more than one responsibility, or something you need anything other than plain JavaScript to do.
You clearly don’t know how much js devs love dependencies! Look up “left-pad incident”
One suggestion - Make the JSON editor panel collapsible or resizable.
Beautiful. Single file, 187 lines of JavaScript, no dependencies, does one thing and does it well. I wish there was a way to search for libraries like this one. Almost every time I look for some piece of open source software, I end up writing it myself because all the solutions I find are overcomplicated and try to do too many things.
This seems a lot like jless, which I've used a _lot_ for exploring complex json files. https://jless.io/
Can you explain a little what are the similarities you found?
Pretty-printed JSON shows siblings down, and children down and to the right. TFA's library shows siblings down and children to the right, plus with squiggly lines and boxes. So I'm not sure how TFA visualizes JSON more than JSON itself already visualizes JSON. It says it's interactive, and I don't see any interaction either other than scrolling, so I may be missing something.
But, assuming that the interaction is supposed to be stuff like hiding children in order to get a higher level view of the data, then drill down to the lower levels of the data, and provide other tools for exploring the data (searching, filtering, etc) then jless does all that too.
...
const container = document.getElementById('json-tree');
container.innerHTML = generateJSONTree(jsonData);
...
const container = document.getElementById('json-tree');
container.jsonTree = jsonData;
Beautiful. Single file, 187 lines of JavaScript, no dependencies, does one thing and does it well. I wish there was a way to search for libraries like this one. Almost every time I look for some piece of open source software, I end up writing it myself because all the solutions I find are overcomplicated and try to do too many things.
Earlier quoted context omitted.
The example on the site is a very simple JSON object that doesn't demonstrate JSONtr.ee's potential at all. To showcase it better, I'd like to see more complex objects on the initial reveal, so I don't have to go and find & format a JSON object just to see if the app/library is worth using yet!
You're absolutely right! Thank you for pointing that out. I've updated the initial JSON example to include a more complex and realistic object that better showcases
I could definitely see using this, but don't think it solves anything for me right now.
I think if the diagrams didn't require horizontal panning, and/or supported interactive collapsing, it would be more effective. As it stands, the text view on the left side of the screen is actually easier to parse at a glance than the tree.
Generally, vertical scrolling is more natural for reading this kind of data, and also works better on mobile.
So a first guess of an improvement is something like: the tree diagram generally grows flat & vertical, with horizontal panning (or a manual "expand" click) reserved for deeply nested objects.