interact.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 1,
   "metadata": {},
   "outputs": [],
   "source": [
    "from ipywidgets import interact, interactive, fixed,interact_manual\n",
    "import numpy as np\n",
    "\n",
    "import matplotlib as mpl\n",
    "import matplotlib.pyplot as plt\n",
    "%matplotlib inline\n",
    "\n",
    "import ipywidgets as wg\n",
    "from IPython.display import display\n",
    "\n",
    "import numpy as np"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Slider with default value"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 19,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "41ce647c816b41ed9eba4ee2a6dba705",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(IntSlider(value=1, description='x', max=3, min=-1), Output()), _dom_classes=('widget-int…"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.f(x)>"
      ]
     },
     "execution_count": 19,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "def f(x):\n",
    "    plt.plot(np.arange(0,10), x*np.arange(0,10))\n",
    "    plt.ylim(-30,30)\n",
    "    plt.show()\n",
    "    \n",
    "interact(f,x=1)    "
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Slider with a range of value"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 3,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "78a190bd84dd405daa0fde823d368cc0",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(FloatSlider(value=0.0, description='x', max=3.0, min=-3.0, step=0.5), Output()), _dom_cl…"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.f(x)>"
      ]
     },
     "execution_count": 3,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "def f(x):\n",
    "    plt.plot(np.arange(0,10), x*np.arange(0,10))\n",
    "    plt.ylim(-30,30)\n",
    "    plt.show()\n",
    "    \n",
    "interact(f,x=(-3,3,0.5))    "
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# With boolean and checkbox"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "f6ac0963dd3141fbb60832675f0878b5",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(Checkbox(value=True, description='x'), Output()), _dom_classes=('widget-interact',))"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.f(x)>"
      ]
     },
     "execution_count": 4,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "rands = np.random.rand(100)\n",
    "def f(x):\n",
    "    if x:\n",
    "        plt.plot(rands,'b')\n",
    "    else:\n",
    "        plt.plot(rands,'r')\n",
    "    plt.show()    \n",
    "        \n",
    "        \n",
    "interact(f,x=True)        \n",
    "        "
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# With a decorater"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "96eb7506027d45dba7b94a4cbc57b64a",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(Text(value='Title of plot', description='x'), Output()), _dom_classes=('widget-interact'…"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "# interact as a decorater\n",
    "\n",
    "@interact(x='Title of plot')\n",
    "def f(x):\n",
    "    plt.title(x)\n",
    "    plt.show()\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# With multiple widget"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "f8b00045486a446fa58d397eee5ad623",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(IntSlider(value=1, description='a', max=3, min=-1), IntSlider(value=3, description='b', …"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.f(a, b)>"
      ]
     },
     "execution_count": 6,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "def f(a,b):\n",
    "    plt.plot(np.arange(1,10), a*np.power(np.arange(1,10),b))\n",
    "    plt.title(\"Power Law: $x=ay^b$\")\n",
    "    plt.show()\n",
    "    \n",
    "interact(f, a=1,b=3)    "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 7,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "aed8968f47d34c9e969a52b2c1bd99b2",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(IntSlider(value=1, description='a', max=3, min=-1), Output()), _dom_classes=('widget-int…"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.f(a, b)>"
      ]
     },
     "execution_count": 7,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "# with fixed value\n",
    "def f(a,b):\n",
    "    plt.plot(np.arange(0,10), a*np.power(np.arange(0,10),b))\n",
    "    plt.title(\"Power Law: $x=ay^b$\")\n",
    "    plt.show()\n",
    "    \n",
    "interact(f, a=1,b=fixed(2)) \n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Dropdowns"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 8,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "bf01c1e323ac4d53b4f35fb16d95ca0a",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(IntSlider(value=1, description='a', max=3, min=-1), IntSlider(value=1, description='b', …"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.f(a, b, colour)>"
      ]
     },
     "execution_count": 8,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "def f(a,b,colour):\n",
    "    plt.plot(np.arange(0,10), a*np.power(np.arange(0,10),b), c=colour)\n",
    "    plt.title(\"Power Law: $x=ay^b$\")\n",
    "    plt.show()\n",
    "    \n",
    "colours = ['red','green','blue']\n",
    "interact(f, a=1,b=1, colour=colours) \n",
    "\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 9,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "9aee8086b50947308738aee700003324",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(IntSlider(value=1, description='a', max=3, min=-1), Dropdown(description='b', options={'…"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.f(a, b, colour)>"
      ]
     },
     "execution_count": 9,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "# Dropdown with dictionary\n",
    "def f(a,b,colour):\n",
    "    plt.plot(np.arange(0,10), a*np.power(np.arange(0,10),b), c=colour)\n",
    "    plt.title(\"Power Law: $x=ay^b$\")\n",
    "    plt.show()\n",
    "    \n",
    "powers= {'one':1,'two':2, 'three':3}    \n",
    "    \n",
    "colours = ['red','green','blue']\n",
    "interact(f, a=1,b=powers, colour=colours) \n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Slider (alternative)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 10,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "9dab08484f994ff88c4eaee0f671779f",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "Text(value='Name')"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "4e129a3ebfee47cebe3d1dd24e3ae038",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "IntSlider(value=0, description='Age: ')"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "name = wg.Text(value='Name')\n",
    "age=wg.IntSlider(description ='Age: ')\n",
    "display(name,age)\n"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 11,
   "metadata": {},
   "outputs": [
    {
     "name": "stdout",
     "output_type": "stream",
     "text": [
      "Name is 0 years old.\n"
     ]
    }
   ],
   "source": [
    "print(name.value + ' is ' + str(age.value) + ' years old.')"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Slider with link"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 12,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "5931dfc426b84d9f97f382d64d9dce2e",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "FloatText(value=0.0)"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "c8cbe030d61f4a18b9c502666e021daf",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "FloatSlider(value=0.0)"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "a = wg.FloatText()\n",
    "b = wg.FloatSlider()\n",
    "display(a,b)\n",
    "mylink = wg.jslink((a,'value'),(b,'value'))"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Plot with slider"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 13,
   "metadata": {},
   "outputs": [],
   "source": [
    "def myPlot(c):\n",
    "    x=np.linspace(-5,5,20)\n",
    "    y= c * x**2\n",
    "    plt.plot(x,y,'r--')\n",
    "    plt.ylabel('y(x)')\n",
    "    plt.xlabel('x')\n",
    "    plt.ylim([0,80])\n",
    "    plt.xlim([-5,5])   \n",
    "    "
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 14,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "3db4bcb3003a46bf9197e01025ed28ff",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "interactive(children=(FloatSlider(value=1.0, description='c', max=3.0), Output()), _dom_classes=('widget-inter…"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    },
    {
     "data": {
      "text/plain": [
       "<function __main__.myPlot(c)>"
      ]
     },
     "execution_count": 14,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "c_slide =wg.FloatSlider(value=1.0,min=0,max=3.0,step=0.1)\n",
    "wg.interact(myPlot, c=c_slide)"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# list of things you can do with slider"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 15,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/plain": [
       "['_dom_classes',\n",
       " '_model_module',\n",
       " '_model_module_version',\n",
       " '_model_name',\n",
       " '_view_count',\n",
       " '_view_module',\n",
       " '_view_module_version',\n",
       " '_view_name',\n",
       " 'continuous_update',\n",
       " 'description',\n",
       " 'description_tooltip',\n",
       " 'disabled',\n",
       " 'layout',\n",
       " 'max',\n",
       " 'min',\n",
       " 'orientation',\n",
       " 'readout',\n",
       " 'readout_format',\n",
       " 'step',\n",
       " 'style',\n",
       " 'value']"
      ]
     },
     "execution_count": 15,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "c_slide.keys"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 16,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/plain": [
       "<ipywidgets.widgets.widget.WidgetRegistry at 0x2671c05d648>"
      ]
     },
     "execution_count": 16,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "# suppose to show list of widget types - but does not work (worked in Youtube video)\n",
    "wg.Widget.widget_types\n"
   ]
  },
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "# Progress bar"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 17,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "c7fe16ecce6447c7bab1b349ebdb5655",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "IntProgress(value=0, description='Loading: ')"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "# horizontal progress bar\n",
    "import time\n",
    "progress = wg.IntProgress(description = 'Loading: ')\n",
    "progress.orientation = 'horizontal'\n",
    "display(progress)\n",
    "\n",
    "for i in range(100):\n",
    "    progress.value =i\n",
    "    time.sleep(0.1)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 18,
   "metadata": {},
   "outputs": [
    {
     "data": {
      "application/vnd.jupyter.widget-view+json": {
       "model_id": "cd4131f1d824414ab60eb7fc375f2b4b",
       "version_major": 2,
       "version_minor": 0
      },
      "text/plain": [
       "IntProgress(value=0, description='Loading: ', orientation='vertical')"
      ]
     },
     "metadata": {},
     "output_type": "display_data"
    }
   ],
   "source": [
    "# vertical progress bar\n",
    "import time\n",
    "progress = wg.IntProgress(description = 'Loading: ')\n",
    "progress.orientation = 'vertical'\n",
    "display(progress)\n",
    "\n",
    "for i in range(100):\n",
    "    progress.value =i\n",
    "    time.sleep(0.1)"
   ]
  }
 ],
 "metadata": {
  "hide_input": false,
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.7.7"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 4
}