This tutorial will guide you through the process of integrating WebDataRocks Pivot Table with Jupyter Notebook – a web-based interactive application for sharing notebooks with live code, visualizations, text, and other media. As a result, you will get a notebook empowered with a pivot table for interactive data exploration and data analysis.

Prerequisites

Before installing the Jupyter Notebook, make sure Python is installed on your machine. Jupyter requires Python 3.3 or greater, or Python 2.7

Next, start using Jupyter in one of the following ways:

  • Using Anaconda – an open-source distribution with plenty of pre-installed Python packages for data science and scientific computing.
  • Using pip – a Python’s package manager.
  • Via a web version of classic Notebook or JupyterLab.

Ways to integrate WebDataRocks with Jupyter

  1. Integrate WebDataRocks Pivot Table with a new/existing Jupyter Notebook application.
  2. Run a Jupyter Notebook with WebDataRocks sample from GitHub.

Integrate WebDataRocks Pivot Table with a new/existing Jupyter Notebook application

To integrate WebDataRocks Pivot Table into a notebook, follow the next steps:

  1. Depending on the preferred way of using Jupyter, start the notebook server (e.g., launch it from the Anaconda Navigator, from the command line, or simply by running the web version). Create a new Python 3 notebook or open the existing one. 
  2. Next, import the following Python libraries into the notebook:

    1. IPython.display – an API for display tools in IPython. From this module, import only the HTML class for rendering the HTML content in the notebook.

    2. json – a module for serializing and de-serializing Python objects.

    3. pandas – a library for working with data frames.

    from IPython.display import HTML
import json
import pandas as pd

  3. Define a function that accepts JSON-formatted string and renders it as a pivot table on the HTML page:

    def pivot(webdatarocks_json_object):
   code = '''
     <link href="https://cdn.webdatarocks.com/latest/webdatarocks.min.css" rel="stylesheet">
     <script src="https://cdn.webdatarocks.com/latest/webdatarocks.js"></script>
     <h1>WebDataRocks Integration with Jupyter Notebook
     <div id="pivot-container"></div>
     <script>
     new WebDataRocks({0});
     </script>
     '''.format(webdatarocks_json_object)
   return HTML(code)

  4. Create a pandas data frame and fill it with data. The data can come from a CSV/JSON/Excel file, SQL database, or other storage of choice. For simplicity, we will use the static inline data: 

    df = pd.DataFrame([['Apple pie', '20'], ['Lemon cake', '30']], index=['row 1', 'row 2'], columns=['Product', 'Quantity'])

  5. Convert a dataframe to a JSON string:

    json_data = df.to_json(orient='records')

    Note that it’s important to set the orient parameter to records. This way the object will be translated into a list-like structure: [{column -> value}, … , {column -> value}]. This structure corresponds to the format of a JSON data source accepted by WebDataRocks.

  6. Create an instance of WebDataRocks using the dictionary as follows:

    webdatarocks = {
    "container": "#pivot-container",
    "width": "100%",
    "height": 430,
    "toolbar": True,
    "report": {
        "dataSource": {
            "type": "json",
            "data": json.loads(json_data)
        },
        "slice": {
            "rows": [
                {
                    "uniqueName": "Product"
                }
            ],
            "columns": [
                {
                    "uniqueName": "Measures"
                }
            ],
            "measures": [
                {
                    "uniqueName": "Quantity",
                    "aggregation": "sum"
                }
            ]
        }
    }

    Here we have specified the initialization parameters and set the slice. For connecting to a data source, we have decoded JSON using the json.loads() method and set the response to the dataSource.data property of the pivot table.

  7. Use json.dumps() to encode the webdatarocks object to a JSON-formatted string. 

    webdatarocks_json_object = json.dumps(webdatarocks)

  8. Pass the JSON-formatted string with the pivot table’s configuration to the previously defined pivot function:

    pivot(webdatarocks_json_object)

  9. Run the code containing in the notebook’s cells by selecting Cell/Run All or running the cells separately one after another.

    The pivot table component will be rendered as an output of the cell where the pivot function is called.

Run a Jupyter Notebook with WebDataRocks sample from GitHub

  1. Download the project as a .zip archive or clone the GitHub sample:
    git clone https://github.com/WebDataRocks/pivot-jupyter-notebook/

  2. Depending on the preferred way of using Jupyter, start the notebook server (e.g., launch it from the Anaconda Navigator, from the command line, or simply by running the web version)

  3. Import the WebDataRocks_in_Jupyter_Notebook.ipynb file into the Jupyter working directory.

  4. Run the code containing in the notebook’s cells by selecting Cell/Run All or running the cells separately one after another.

See also