title: How to change the default position of a ipywidget slider to the side of a matplotlib figure?
body: <p>I am looking into a way to change the position of the vertical IntSlider to the right of the matplotlib fig. Here is the code:</p>
  
  <pre><code>from ipywidgets import interact, fixed, IntSlider
  import numpy as np
  from matplotlib import pyplot as plt
  
  %matplotlib notebook
  
  fig = plt.figure(figsize=(8,4))
  
  xs = np.random.random_integers(0, 5000, 50)
  ys = np.random.random_integers(0, 5000, 50)
  
  ax = fig.add_subplot(111)
  scat, = ax.plot(xs, ys, 'kx', markersize=1)
  ax.grid(which='both', color='.25', lw=.1)
  ax.set_aspect('equal'), ax.set_title('Rotate')
  
  def rotate(theta, xs, ys):
      new_xs = xs * np.cos(np.deg2rad(theta)) - ys * np.sin(np.deg2rad(theta))
      new_xs -= new_xs.min()
      new_ys = xs * np.sin(np.deg2rad(theta)) + ys * np.cos(np.deg2rad(theta))
      new_ys -= new_ys.min()
      return new_xs, new_ys
  
  def update_plot(theta, xs, ys):
      new_xs, new_ys = rotate(theta, xs, ys)
      scat.set_xdata(new_xs), scat.set_ydata(new_ys)
      ax.set_xlim(new_xs.min() - 500, new_xs.max() + 500)
      ax.set_ylim(new_ys.min() - 500, new_ys.max() + 500)
  
  w = interact(update_plot, 
               theta=IntSlider(min=-180, max=180, step=5,value=0, orientation='vertical'), 
               xs=fixed(xs), 
               ys=fixed(ys))
  </code></pre>
  
  <p>This is what I have:</p>
  
  <p><a href="https://i.stack.imgur.com/M1mfh.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/M1mfh.png" alt="enter image description here"></a></p>
  
  <p>This is what I want:</p>
  
  <p><a href="https://i.stack.imgur.com/O8ITZ.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/O8ITZ.jpg" alt="enter image description here"></a></p>
  
  <p>There might be a very simple way to do this, but I can't figure out myself.</p>
  
  <p>I tried to place both the <code>fig</code> and the <code>interactive</code> widget into a <code>VBox</code> then wrapping the <code>VBox</code> with <code>IPython.display</code> and it didn't work.</p>
  
  <p>Could not find a straight solution to this in the examples.</p>
  
  <p>EDIT1:</p>
  
  <p>ipywidgets provides an <code>Output()</code> class that captures the output area and use it inside the widget context.</p>
  
  <p>I will try to figure out how to use it.</p>
  
  <p>This is the object:
  <a href="https://github.com/jupyter-widgets/ipywidgets/blob/master/ipywidgets/widgets/widget_output.py" rel="nofollow noreferrer">https://github.com/jupyter-widgets/ipywidgets/blob/master/ipywidgets/widgets/widget_output.py</a></p>