DEV Community

Dipankar Das
Dipankar Das

Posted on

Tired of messy JSON? I made a tool that visualizes your data as both a tree and a pannable graph. πŸš€

Hey everyone! πŸ‘‹

I’ve always found it a bit painful to debug deeply nested JSON files, so I decided to build my own visualizer. Instead of just a boring list, I wanted something more interactive and visual.

I call it JSON Tree Viewer.

Live Demo: https://debabratasaha-dev.github.io/JSON-tree-viewer/
GitHub Repo: https://github.com/debabratasaha-dev/JSON-tree-viewer

Key Features:
πŸ•ΈοΈ Dual View: Switch between a classic interactive Tree View and a zoomable Graph View.
πŸ” Interactive Graph: Drag, pan, and zoom to explore complex JSON structures visually.
🎨 Modern UI: Built with a glassmorphism sidebar, smooth animations, and a sleek dark mode.
🏷️ Smart Tagging: Automatically detects data types (Strings, Numbers, Objects, etc.) with clean icons.
πŸš€ Lightweight: Zero heavy frameworksβ€”just pure HTML, CSS, and JavaScript.
I’d love to hear your feedback! What features should I add next? If you find it useful, I’d really appreciate a ⭐️ on GitHub!

Top comments (0)