JSON Graph Visualizer (Draggable Mind Map)

Drag-and-drop, linked node visualization of JSON data.

fruits0detailsnutrients1detailsnutrients2detailsnutrients
root:
1 keys
fruits: [3 items]
fruits:
0 items
Empty array
0:
4 keys
name:"Apple"
color:"#FF0000"
details: {Object.keys(item.value || {}).length} keys
nutrients: {Object.keys(item.value || {}).length} keys
details:
2 keys
type:"Pome"
season:"Fall"
nutrients:
4 keys
calories:52
fiber:"2.4g"
vitaminC:"4.6mg"
potassium:"14mg"
1:
4 keys
name:"Banana"
color:"#FFFF00"
details: {Object.keys(item.value || {}).length} keys
nutrients: {Object.keys(item.value || {}).length} keys
details:
2 keys
type:"Berry"
season:"Year-round"
nutrients:
4 keys
calories:89
fiber:"2.6g"
potassium:"358mg"
vitaminC:"8.7mg"
2:
4 keys
name:"Orange"
color:"#FFA500"
details: {Object.keys(item.value || {}).length} keys
nutrients: {Object.keys(item.value || {}).length} keys
details:
2 keys
type:"Citrus"
season:"Winter"
nutrients:
4 keys
calories:47
fiber:"2.4g"
vitaminC:"53.2mg"
potassium:"181mg"
60%
Drag nodes • Use slider/scroll to zoom • Drag background to pan