JSON visualization tool | Hacker News Reader

JSON visualization tool

chris.photobooks.com

42 pointsmcantelon11 comments

This is awesome, really cool tool, I would make the render link more obvious though, I entered some JSON and sat there wondering for a second what to do.

Also, render and clear are dangerously close together.

A link is the wrong object for this functionality. It should be a button, because it is an action that causes something to happen, rather than a link to another page.

A link tells me, "When you click, you'll see a different page."

A button tells me, "When you click this, something is going to happen to whatever you pasted in the form field."

I've made the "render" link into a button. Thanks for the suggestions!

Are there any other adjustments that people would like to see made?

The difference between rendering strings and numbers as HTML is not very clear, and could probably be improved (by using quotes around strings). A faded green 2 is a string ("2"). A bright green 2 is a number.

Also, "Strict JSON" is not very strict (it permits numeric keys and implicitly converts them to strings, which is not within the JSON spec). I'm not sure if there are any other problems with it, nor if this is really the fault of the app or some code it uses (I didn't bother to check any of the internals).

I'm afraid I'm not terribly good at color schemes, being color blind. If you would like to suggest an alternative color, I'll certainly consider it.

"Strict JSON" makes use of the YUI JSON tool (2.6.0) for parsing, which disallows a few things: functions, regex objects, etc. Thus, the idea behind "Strict JSON" mode is to ensure that the provided JSON may be parsed by a JSON-parsing library, as opposed to requiring eval (I wrote this before native JSON support was available in most browsers).

I have not attempted to make my own "strict" JSON parser because I'm not sure what additional benefit would be gained from doing so. JSLint already has a perfectly functional JSON-checking mode that will give warnings about anything I would consider warning about.

Thanks for the comments!

Sorry for not getting back to you, not used to HN yet. It's not that the color scheme is hard to see-- I can tell apart faded and bright green fine enough for the purposes of discriminating that they are different. What I can't tell is whether faded is numbers and bright is strings, or vice versa. It's not really obvious, and probably isn't no matter what color you pick (although red seems to be exclusive to strings in all the highlighting schemes I've used) no matter which colors you pick, is what the problem really is-- perhaps, instead, you could enclose strings with quote marks.

It would be cool to see a javascript library with this sort of functionality, it could be quite useful for generating dynamic visualization's on web sites.

There's http://github.com/jamespadolsey/prettyPrint.js

excellent, especially since it feels like I play with Twitter JSON all day these days.

Reply on news.ycombinator.com