Notebook snippets, tips and tricks

Jérémie Decock (www.jdhp.org)

Import directives

In [1]:
%matplotlib notebook

# As an alternative, one may use: %pylab notebook

# For old Matplotlib and Ipython versions, use the non-interactive version:
# %matplotlib inline or %pylab inline

# To ignore warnings (http://stackoverflow.com/questions/9031783/hide-all-warnings-in-ipython)
import warnings
warnings.filterwarnings('ignore')

import math
import numpy as np
import matplotlib.pyplot as plt

import ipywidgets
from ipywidgets import interact

Useful keyboard shortcuts

  • Enter edit mode: Enter
  • Enter command mode: Escape

In command mode:

  • Show keyboard shortcuts: h
  • Find and replace: f
  • Insert a cell above the selection: a
  • Insert a cell below the selection: b
  • Switch to Markdown: m
  • Delete the selected cells: dd (type twice 'd' quickly)
  • Undo cell deletion: z
  • Execute the selected cell: Ctrl + Enter
  • Execute the selected cell and select the next cell: Shift + Enter
  • Execute the selected cell and insert below: Alt + Enter
  • Toggle output: o
  • Toggle line number: l
  • Copy selected cells: c
  • Paste copied cells below: v
  • Select the previous cell: k
  • Select the next cell: j

In edit mode:

  • Code completion or indent: Tab
  • Tooltip: Shift + Tab
    • Type "Shift + Tab" twice to see the online documentation of the selected element
    • Type "Shift + Tab" 4 times to the online documentation in a dedicated frame
  • Indent: ⌘] (on MacOS)
  • Dedent: ⌘[ (on MacOS)
  • Execute the selected cell: Ctrl + Enter
  • Execute the selected cell and select the next cell: Shift + Enter
  • Execute the selected cell and insert below: Alt + Enter
  • Cut a cell at the current cursor position: Ctrl + Shift + -

Matplotlib

To plot a figure within a notebook, insert the %matplotlib notebook (or %pylab notebook) directive at the begining of the document.

As an alternative, one may use %matplotlib inline (or %pylab inline) for non-interactive plots on old Matplotlib/Ipython versions.

2D plots

In [2]:
x = np.arange(-2 * np.pi, 2 * np.pi, 0.1)
y = np.sin(x)
plt.plot(x, y)
Out[2]:
[<matplotlib.lines.Line2D at 0x110b10d30>]

3D plots

In [3]:
from mpl_toolkits.mplot3d import axes3d

# Build datas ###############

x = np.arange(-5, 5, 0.25)
y = np.arange(-5, 5, 0.25)

xx,yy = np.meshgrid(x, y)
z = np.sin(np.sqrt(xx**2 + yy**2))

# Plot data #################

fig = plt.figure()
ax = axes3d.Axes3D(fig)
ax.plot_wireframe(xx, yy, z)

plt.show()

Animations

In [4]:
from matplotlib.animation import FuncAnimation

# Plots
fig, ax = plt.subplots()

def update(frame):
    x = np.arange(frame/10., frame/10. + 2. * math.pi, 0.1)
    ax.clear()
    ax.plot(x, np.cos(x))

    # Optional: save plots
    filename = "img_{:03}.png".format(frame)
    plt.savefig(filename)

# Note: "interval" is in ms
anim = FuncAnimation(fig, update, interval=100)

plt.show()

Interactive plots with Plotly

Interactive plots with Bokeh

Embedded HTML and Javascript

In [5]:
%%html
<div id="toc"></div>
In [6]:
%%javascript
var toc = document.getElementById("toc");
toc.innerHTML = "<b>Table of contents:</b>";
toc.innerHTML += "<ol>"

var h_list = $("h2, h3");    //$("h2");    // document.getElementsByTagName("h2");
for(var i = 0 ; i < h_list.length ; i++) {
    var h = h_list[i];
    var h_str = h.textContent.slice(0, -1);  // "slice(0, -1)" remove the last character
    if(h_str.length > 0) {
        if(h.tagName == "H2") {  // https://stackoverflow.com/questions/10539419/javascript-get-elements-tag
            toc.innerHTML += "<li><a href=\"#" + h_str.replace(/\s+/g, '-') + "\">" + h_str + "</a></li>";
        } else if(h.tagName == "H3") {  // https://stackoverflow.com/questions/10539419/javascript-get-elements-tag
            toc.innerHTML += "<li> &nbsp;&nbsp;&nbsp; <a href=\"#" + h_str.replace(/\s+/g, '-') + "\">" + h_str + "</a></li>";
        }
    }
}

toc.innerHTML += "</ol>"

IPython built-in magic commands

Execute an external python script

In [7]:
%run ./notebook_snippets_run_test.py
Hello, world!
¡Buenos días!
Bonjour!
你好!
In [8]:
%run ./notebook_snippets_run_mpl_test.py

Load an external python script

Load the full script

In [9]:
%load ./notebook_snippets_run_mpl_test.py

Load a specific symbol (funtion, class, ...)

In [10]:
%load -s main ./notebook_snippets_run_mpl_test.py

Load specific lines

In [11]:
%load -r 22-41 ./notebook_snippets_run_mpl_test.py

Time measurement

%time

In [12]:
%%time
plt.hist(np.random.normal(loc=0.0, scale=1.0, size=100000), bins=50)
CPU times: user 123 ms, sys: 8.35 ms, total: 132 ms
Wall time: 127 ms
Out[12]:
(array([  2.00000000e+00,   3.00000000e+00,   6.00000000e+00,
          6.00000000e+00,   1.30000000e+01,   2.70000000e+01,
          3.10000000e+01,   7.60000000e+01,   1.17000000e+02,
          1.73000000e+02,   2.59000000e+02,   4.59000000e+02,
          6.29000000e+02,   8.97000000e+02,   1.28500000e+03,
          1.65900000e+03,   2.15800000e+03,   2.83700000e+03,
          3.57100000e+03,   4.27600000e+03,   4.89000000e+03,
          5.71300000e+03,   6.29400000e+03,   6.42300000e+03,
          6.89200000e+03,   6.96000000e+03,   6.65100000e+03,
          6.35100000e+03,   5.85900000e+03,   5.06600000e+03,
          4.51600000e+03,   3.81500000e+03,   3.17300000e+03,
          2.48900000e+03,   1.89100000e+03,   1.38000000e+03,
          1.05400000e+03,   7.64000000e+02,   4.74000000e+02,
          3.45000000e+02,   1.91000000e+02,   1.35000000e+02,
          8.30000000e+01,   3.90000000e+01,   3.20000000e+01,
          1.40000000e+01,   1.20000000e+01,   5.00000000e+00,
          3.00000000e+00,   2.00000000e+00]),
 array([-4.34689294, -4.17442252, -4.00195211, -3.82948169, -3.65701127,
        -3.48454085, -3.31207044, -3.13960002, -2.9671296 , -2.79465918,
        -2.62218877, -2.44971835, -2.27724793, -2.10477751, -1.9323071 ,
        -1.75983668, -1.58736626, -1.41489584, -1.24242542, -1.06995501,
        -0.89748459, -0.72501417, -0.55254375, -0.38007334, -0.20760292,
        -0.0351325 ,  0.13733792,  0.30980833,  0.48227875,  0.65474917,
         0.82721959,  0.99969   ,  1.17216042,  1.34463084,  1.51710126,
         1.68957167,  1.86204209,  2.03451251,  2.20698293,  2.37945334,
         2.55192376,  2.72439418,  2.8968646 ,  3.06933502,  3.24180543,
         3.41427585,  3.58674627,  3.75921669,  3.9316871 ,  4.10415752,
         4.27662794]),
 <a list of 50 Patch objects>)

%timeit

In [13]:
%%timeit
plt.hist(np.random.normal(loc=0.0, scale=1.0, size=100000), bins=50)
10 loops, best of 3: 64.8 ms per loop

ipywidget

In [14]:
#help(ipywidgets)
#dir(ipywidgets)
In [15]:
from ipywidgets import IntSlider
from IPython.display import display

slider = IntSlider(min=1, max=10)
display(slider)
Widget Javascript not detected.  It may not be installed or enabled properly.

ipywidgets.interact

Documentation

In [16]:
#help(ipywidgets.interact)

Using interact as a decorator with named parameters

To me, this is the best option for single usage functions...

Text

In [17]:
@interact(text="IPython Widgets")
def greeting(text):
    print("Hello {}".format(text))
Hello IPython Widgets

Integer (IntSlider)

In [18]:
@interact(num=5)
def square(num):
    print("{} squared is {}".format(num, num*num))
5 squared is 25
In [19]:
@interact(num=(0, 100))
def square(num):
    print("{} squared is {}".format(num, num*num))
50 squared is 2500
In [20]:
@interact(num=(0, 100, 10))
def square(num):
    print("{} squared is {}".format(num, num*num))
50 squared is 2500

Float (FloatSlider)

In [21]:
@interact(num=5.)
def square(num):
    print("{} squared is {}".format(num, num*num))
5.0 squared is 25.0
In [22]:
@interact(num=(0., 10.))
def square(num):
    print("{} squared is {}".format(num, num*num))
5.0 squared is 25.0
In [23]:
@interact(num=(0., 10., 0.5))
def square(num):
    print("{} squared is {}".format(num, num*num))
5.0 squared is 25.0

Boolean (Checkbox)

In [24]:
@interact(upper=False)
def greeting(upper):
    text = "hello"
    if upper:
        print(text.upper())
    else:
        print(text.lower())
hello

List (Dropdown)

In [25]:
@interact(name=["John", "Bob", "Alice"])
def greeting(name):
    print("Hello {}".format(name))
Hello John

Dictionnary (Dropdown)

In [26]:
@interact(word={"One": "Un", "Two": "Deux", "Three": "Trois"})
def translate(word):
    print(word)
Deux
In [27]:
x = np.arange(-2 * np.pi, 2 * np.pi, 0.1)

@interact(function={"Sin": np.sin, "Cos": np.cos})
def plot(function):
    y = function(x)
    plt.plot(x, y)

Using interact as a decorator

Text

In [28]:
@interact
def greeting(text="World"):
    print("Hello {}".format(text))
Hello World

Integer (IntSlider)

In [29]:
@interact
def square(num=2):
    print("{} squared is {}".format(num, num*num))
2 squared is 4
In [30]:
@interact
def square(num=(0, 100)):
    print("{} squared is {}".format(num, num*num))
50 squared is 2500
In [31]:
@interact
def square(num=(0, 100, 10)):
    print("{} squared is {}".format(num, num*num))
50 squared is 2500

Float (FloatSlider)

In [32]:
@interact
def square(num=5.):
    print("{} squared is {}".format(num, num*num))
5.0 squared is 25.0
In [33]:
@interact
def square(num=(0., 10.)):
    print("{} squared is {}".format(num, num*num))
5.0 squared is 25.0
In [34]:
@interact
def square(num=(0., 10., 0.5)):
    print("{} squared is {}".format(num, num*num))
5.0 squared is 25.0

Boolean (Checkbox)

In [35]:
@interact
def greeting(upper=False):
    text = "hello"
    if upper:
        print(text.upper())
    else:
        print(text.lower())
hello

List (Dropdown)

In [36]:
@interact
def greeting(name=["John", "Bob", "Alice"]):
    print("Hello {}".format(name))
Hello John

Dictionnary (Dropdown)

In [37]:
@interact
def translate(word={"One": "Un", "Two": "Deux", "Three": "Trois"}):
    print(word)
Deux
In [38]:
x = np.arange(-2 * np.pi, 2 * np.pi, 0.1)

@interact
def plot(function={"Sin": np.sin, "Cos": np.cos}):
    y = function(x)
    plt.plot(x, y)

Using interact as a function

To me, this is the best option for multiple usage functions...

Text

In [39]:
def greeting(text):
    print("Hello {}".format(text))
    
interact(greeting, text="IPython Widgets")
Hello IPython Widgets
Out[39]:
<function __main__.greeting>

Integer (IntSlider)

In [40]:
def square(num):
    print("{} squared is {}".format(num, num*num))

interact(square, num=5)
5 squared is 25
Out[40]:
<function __main__.square>
In [41]:
def square(num):
    print("{} squared is {}".format(num, num*num))

interact(square, num=(0, 100))
50 squared is 2500
Out[41]:
<function __main__.square>
In [42]:
def square(num):
    print("{} squared is {}".format(num, num*num))

interact(square, num=(0, 100, 10))
50 squared is 2500
Out[42]:
<function __main__.square>

Float (FloatSlider)

In [43]:
def square(num):
    print("{} squared is {}".format(num, num*num))

interact(square, num=5.)
5.0 squared is 25.0
Out[43]:
<function __main__.square>
In [44]:
def square(num):
    print("{} squared is {}".format(num, num*num))

interact(square, num=(0., 10.))
5.0 squared is 25.0
Out[44]:
<function __main__.square>
In [45]:
def square(num):
    print("{} squared is {}".format(num, num*num))

interact(square, num=(0., 10., 0.5))
5.0 squared is 25.0
Out[45]:
<function __main__.square>

Boolean (Checkbox)

In [46]:
def greeting(upper):
    text = "hello"
    if upper:
        print(text.upper())
    else:
        print(text.lower())

interact(greeting, upper=False)
hello
Out[46]:
<function __main__.greeting>

List (Dropdown)

In [47]:
def greeting(name):
    print("Hello {}".format(name))

interact(greeting, name=["John", "Bob", "Alice"])
Hello John
Out[47]:
<function __main__.greeting>

Dictionnary (Dropdown)

In [48]:
def translate(word):
    print(word)

interact(translate, word={"One": "Un", "Two": "Deux", "Three": "Trois"})
Deux
Out[48]:
<function __main__.translate>
In [49]:
x = np.arange(-2 * np.pi, 2 * np.pi, 0.1)

def plot(function):
    y = function(x)
    plt.plot(x, y)

interact(plot, function={"Sin": np.sin, "Cos": np.cos})
Out[49]:
<function __main__.plot>

Example of using multiple widgets on one function

In [50]:
@interact(upper=False, name=["john", "bob", "alice"])
def greeting(upper, name):
    text = "hello {}".format(name)
    if upper:
        print(text.upper())
    else:
        print(text.lower())
hello john

Sound player widget

In [51]:
from IPython.display import Audio

Generate a sound

In [52]:
framerate = 44100
t = np.linspace(0, 5, framerate*5)
data = np.sin(2*np.pi*220*t) + np.sin(2*np.pi*224*t)

Audio(data, rate=framerate)
Out[52]:

Generate a multi-channel (stereo or more) sound

In [53]:
data_left = np.sin(2 * np.pi * 220 * t)
data_right = np.sin(2 * np.pi * 224 * t)

Audio([data_left, data_right], rate=framerate)
Out[53]: