A component to explore JSON data as a hierarchy.

Fields

NameTypeDescriptionOptions
DataObject--
Initial depthNumberSets the initial viewing depth of the JSON tree hierarchy. Use -1 to display the full hierarchy.-
Hide rootBooleanDon’t show the type of the root node when it’s an Object or an Array.
  1. Yes
  2. No
CopyBooleanIf active, adds a control bar with copy JSON button.
  1. Yes
  2. No
JSON indentationWidth--
Secondary textColor--
SeparatorColor--
Custom CSS classesTextCSS classes, separated by spaces. You can define classes in custom stylesheets.-

Low code usage

This component can be declared directly in Python, using backend-driven UI.

ui.JSONViewer(content={
        "data": {}, # Union[Dict, str] 
        "initialDepth": 0.0, # Union[float, str] 
        "hideRoot": "no", # str [yes, no]
        "copy": "no", # str [yes, no]
        "jsonViewerIndentationSpacing": "", # str 
        "secondaryTextColor": "", # str 
        "separatorColor": "", # str 
        "cssClasses": "", # str 
    }
)

Reference