How to include multiple interactive widgets in the same cell in Jupyter notebook

Viewed 2215

My goal is to have one cell in Jupyter notebook displaying multiple interactive widgets. Specifically, I would like to have four slider for cropping an image and then another separate slider for rotating this cropped image. Of course, both plots should be displayed when I run the code. Here is what I have.

def image_crop(a,b,c,d):
    img_slic=frame[a:b,c:d]

    plt.figure(figsize=(8,8))    
    plt.imshow(img_slic,cmap='RdBu')

    return a,b,c,d

interactive_plot = interactive(image_crop, a = widgets.IntSlider(min=0,max=2000,step=10,value=500,description='Vertical_Uppper'),
                     b = widgets.IntSlider(min=0,max=2000,step=10,value=500,description='Vertical_Lower'),
                     c = widgets.IntSlider(min=0,max=1000,step=10,value=500,description='Horizontal_Left'),
                     d = widgets.IntSlider(min=0,max=1000,step=10,value=500,description='Horizontal_Right') )
interactive_plot

def image_rot(i):
    img_rot=scipy.ndimage.rotate(frame_slic.T,i)

    plt.figure(figsize=(8,8))
    plt.imshow(img_rot,cmap='RdBu')

    return i

interactive_plot_2 = interactive(image_rot, i = 
widgets.IntSlider(min=-180,max=180,step=1,value=0,description='Rotation'))

I can have this in two cells (the first one crops while the second one rotates), but not in one.

1 Answers

Jupyter will display only one widget because it always displays only the output of the last command in the cell, so you want to put both widgets in one command. You can do this using Layout, for example, a Box:

from ipywidgets import Box

items = [interactive_plot, interactive_plot_2]
box = Box(children=items)

box # <- this one command displays all children
Related