\ The joy of jupyter widgets — Martin Durant

Martin Durant

The joy of jupyter widgets

written by Martin Durant on 2018-11-23

Since the start of this year, I have been involved with the Intake project. Intake is all about how to describe and access data and building catalogs, but this article is about the GUI, which was built quickly with jupyter widgets (formerly ipywidgets).

The need for a GUI

Without going into the details of Intake (please, read about it!), the need for a graphical interface alongside the programmatical one was recognised early on. The initial aim was to use jupyter-lab,, which is designed to allow for graphical/interactive panels alongside notebooks and interactive python sessions. However, extensions are written in typescript and require a build-and-deploy cycle to see the results of changes. I, to my shame, am no typescript programmer and I don't even know how the build system works, though doubtless I could begin here

Jupyter Widgets to the rescue

Fortunately, jupyter-widgets is really simple: you can instantiate in a cell and render the interactive output immediately. Because the notebook already ensures that the kernel is running and sets up comms between front- and back-ends, the user interaction logic is wholly python-side.

import ipywidgets
clicks = [0]
button = ipywidgets.Button(description='Click me!')

def action(*args):
    clicks[0] += 1

button.on_click(action)
button

An appropriate button appears, and clicks are nicely collected in the clicks variable. Given the existence of layouts with flexible sizing, where you can add and remove elements at will, this is starting to feel quite a lot like my earlier experience with PyQT. Sure, there is no formal message-passing mechanism, but for simple enough interfaces, you can get by. You can even employ CSS within the elements for detailed styling.

Forward

The resultant GUI is already very useful, and required little code to produce. It can yet be enhanced to do things like show a data extract or plots of the selected data-set, since you can embed other display-able elements or HTML such as produced by Bokeh. Furthermore, the output can already be send to a separate panel in jupyter-lab using a sidecar.

However, there is no reason that this should be the only GUI for Intake. Come one, come all! If someone would like to help be typescript something for jupyter-lab, I would appreciate it, it would be nice to have a permanent data browser in the session not tied to a particular notebook.

Probably the rapidly developing panel library will be able to produce a similarly flexible interface which can be run within or without a notebook, and integrates more naturally with bokeh tabular and graphical output.

Summary: working with jupyter-widgets was remarkably smooth and easy, and I got to a useful, functional interface far faster than I had thought it would take.