JSON Tree Viewer

JSONデータをインタラクティブなツリーとして可視化します。複雑なネスト構造を簡単に展開、折りたたみ、探索できます。

JSON入力

ツリービュー

{
"demo":
"Try pasting some JSON here!"
,
"features":
[
"Tree View"
,
"Copy Path"
,
"Expand/Collapse"
]
}

JSONツリービューアとは?

JSONツリービューアは、JSONデータをインタラクティブな階層ツリー構造として描画します。深くネストされたオブジェクトや配列をノードの展開・折りたたみで探索できます。JSONKitのツリービューアは、JSONPathコピー、型別カラーコーディング、最初の2階層の自動展開による素早い概要把握をサポートしています。

使い方

  1. 入力パネルにJSONを貼り付けます。
  2. JSONが有効になると、右側のツリービューが自動的に更新されます。
  3. オブジェクトや配列の横にある矢印をクリックして、展開・折りたたみを切り替えます。
  4. 任意のノードにカーソルを合わせてコピーアイコンをクリックするとJSONPathをコピーでき、そのままJSONPathクエリツールで使えます。

主な機能

  • オブジェクトと配列を、折りたたみ可能なインタラクティブなツリーで表示します。
  • 各値の型と、オブジェクト・配列ごとの要素数を表示します。
  • 深くネストしたAPIレスポンスも簡単にたどれます。
  • 任意のノードのJSONPathをワンクリックでコピーできます。
  • 入力の編集に合わせてリアルタイムで更新されます。

よくある質問

整形したテキストよりツリービューが向いているのはどんなときですか?
大きなJSONや深くネストしたJSONでは、ツリービューなら不要な部分を折りたたんで、1つのブランチに集中できます。生のドキュメントをコピーしたり編集したりする場合は、整形したテキストのほうが適しています。
JSONを図として表示することはできますか?
はい。JSONグラフビジュアライザーなら、同じデータをノードグラフとして表示できるので、オブジェクト間の関係をひと目で把握するのに役立ちます。
サイズの上限はありますか?
固定の上限はありません。数万ノードに及ぶ非常に大きなドキュメントでは描画が遅くなることがあるため、確認していないブランチは折りたたんでください。