Interactive Widgets

Jupyter widgets enable interactive data visualization in the Jupyter notebooks.

icon to represent multiple notebooks

Notebook Widgets

Notebooks come alive when interactive widgets are used. Users can visualize and control changes in the data. Learning becomes an immersive, plus fun, experience. Researchers can easily see how changing inputs to a model impacts the results.

ipyleaflet Binder GitHub

A library for creating simple interactive maps with panning and zooming, ipyleaflet supports annotations such as polygons, markers, and more generally any geojson-encoded geographical data structure.

Example

from ipyleaflet import Map

Map(center=[34.6252978589571, -77.34580993652344], zoom=10)

Installation

With conda:
conda install -c conda-forge ipyleaflet
With pip:
pip install ipyleaflet
jupyter nbextension enable --py --sys-prefix ipyleaflet
bqplot Binder GitHub

A 2-D interactive data visualization library implementing the constructs of the grammar of graphics, bqplot provides a simple API for creating custom user interactions.

Example

import numpy as np
import bqplot.pyplot as plt

size = 100

plt.figure(title='Scatter plot with colors')
plt.scatter(np.random.randn(size), np.random.randn(size), color=np.random.randn(size))
plt.show()

Installation

With conda:
conda install -c conda-forge bqplot
With pip:
pip install bqplot
jupyter nbextension enable --py --sys-prefix bqplot
pythreejs Binder GitHub

A 3-D visualization library enabling GPU-accelerated computer graphics in Jupyter.

Example

from pythreejs import *

f = """
function f(origu,origv) {
    // scale u and v to the ranges I want: [0, 2*pi]
    var u = 2*Math.PI*origu;
    var v = 2*Math.PI*origv;
    
    var x = Math.sin(u);
    var y = Math.cos(v);
    var z = Math.cos(u+v);
    
    return new THREE.Vector3(x,y,z)
}
"""

surf_g = ParametricGeometry(func=f);
surf = Mesh(geometry=surf_g, material=LambertMaterial(color='green', side='FrontSide'))
surf2 = Mesh(geometry=surf_g, material=LambertMaterial(color='yellow', side='BackSide'))
scene = Scene(children=[surf, surf2, AmbientLight(color='#777777')])
c = PerspectiveCamera(position=[2.5, 2.5, 2.5], up=[0, 0, 1],
                      children=[DirectionalLight(color='white',
                                                 position=[3, 5, 1],
                                                 intensity=0.6)])
Renderer(camera=c, scene=scene, controls=[OrbitControls(controlling=c)])

Installation

With conda:
conda install -c conda-forge pythreejs
With pip:
pip install pythreejs
jupyter nbextension enable --py --sys-prefix pythreejs
ipyvolume Binder GitHub

3d plotting for Python in the Jupyter notebook based on IPython widgets using WebGL.

Example

import ipyvolume.pylab as p3
import numpy as np

fig = p3.figure()
q = p3.quiver(*stream.data[:,0:50,:200], color="red", size=7)
p3.style.use("dark") # looks better
p3.animate_glyphs(q, interval=200)
p3.show()