1. Editor View

The Editor View allows you to dynamically fetch, view, and edit JSON data from an external URL.

URL Format

https://jsonviewer.tools/editor?jsonurl=<yourjsonurl>

Instructions

  1. Replace <yourjsonurl> with the URL of your JSON file.
  2. Paste the URL into your browser and press Enter.
  3. The tool will fetch and display the JSON as a tree view and generate a dynamic graph.

2. Widget (Iframe) View

The Widget View allows you to generate an embeddable graph visualization from your JSON URL.

URL Format

https://jsonviewer.tools/widget?jsonurl=<yourjsonurl>

Instructions

  1. Replace <yourjsonurl> with the URL of your JSON file.
  2. Paste the URL into your browser and press Enter.
  3. The tool will fetch the JSON and generate an embeddable graph visualization.

Embed the Graph

To embed the graph, use the following iframe:

<iframe
src="https://jsonviewer.tools/widget?jsonurl=<yourjsonurl>"
width="100%"
height="500px"
frameborder="0"></iframe>

Features

  • Interactive graphs with zoom and pan capabilities.
  • Customizable iframe dimensions and styles.
  • Fast and lightweight loading.
Edit in JSFiddle