Display JSON

Display JSON with collapsible viewer in Jupyter Notebook

Let's use JSON to display JSON data in collapsible viewer in Jupyter Notebook and in Mercury App.

Required packages

You will need to install mercury package to run this example.


Let's import required packages:

import mercury as mr

Please set App properties:

  • title - will be used in the sidebar,
  • static_notebook - will serve notebook as static website.
app = mr.App(title="Display notebook", static_notebook=True)

Create example dict with data:

data = {
    "firstKey": ["a", "b", "c"],
    "secondKey": [1, 2, 3, 4],
    "thirdKey": "Hello World!"

Display JSON data:


The screenshot with code in the Jupyter Notebook:

Python notebook with dynamic widgets

You can control at what initial level show your JSON data by setting level argument:

# show data at second level
mr.JSON(data, level=2)

Please remember, that widget update doesn't trigger automatic cell re-execution during notebook development in Jupyter Notebook.

Cells are automatically re-executed in Mercury.

Mercury App

Please start Mercury in the same directory as notebook:

mercury run 

The Mercury Site is available at

Please open notebook with JSON viewer, you can interact with displayed data by clicking + and - buttons:

Mercury App with JSON viewer

The notebook code is available in mercury-examples (opens in a new tab) GitHub repository.