j1-template 2022.5.0.rc1 → 2022.5.0.rc4

data/lib/starter_web/pages/public/_jupyter/notebooks/j1/j1_interactive_widgets.ipynb

@@ -0,0 +1,442 @@
+{
+ "cells": [
+  {
+   "cell_type": "code",
+   "execution_count": 1,
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "import matplotlib.pyplot as plt\n",
+    "import matplotlib.gridspec as gridspec\n",
+    "import ipywidgets as widgets\n",
+    "from ipywidgets import interact, Layout, IntSlider, FloatSlider\n",
+    "import numpy as np\n",
+    "from numpy import arange,sin,pi"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "###  IntSlider for interactive calculation"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 2,
+   "metadata": {},
+   "outputs": [
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "352fc7185b5c4b7ca97babd9dc9ba537",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "interactive(children=(IntSlider(value=5, description='Slider value:', layout=Layout(width='99%'), max=10), Out…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    }
+   ],
+   "source": [
+    "def printf(str, *args):\n",
+    "    print(str % args, end='')\n",
+    "\n",
+    "# Define the square function\n",
+    "#\n",
+    "def square(x):\n",
+    "    result = x * x\n",
+    "\n",
+    "    # print short notice above the result value\n",
+    "    print(f'Result of square({x}) is:', end='')\n",
+    "\n",
+    "    return result\n",
+    "\n",
+    "# Simple interact widget from ipywidgets\n",
+    "#\n",
+    "interact = interact(\n",
+    "    square,\n",
+    "    x=IntSlider(\n",
+    "        value=5,\n",
+    "        min=0,\n",
+    "        max=10,\n",
+    "        step=1,\n",
+    "        description='Slider value:',\n",
+    "        layout=Layout(width='99%')\n",
+    "    )\n",
+    ");\n",
+    "\n",
+    "# the semicolon ';' suppress the output\n",
+    "# of the code execution\n",
+    "#\n",
+    "interact;"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### FloatSlider for interactive plotting"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 3,
+   "metadata": {},
+   "outputs": [
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "21e7e5bf89904f37aac36cffe9ae5acd",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "interactive(children=(FloatSlider(value=3.141592653589793, description='Value (x):', layout=Layout(width='99%'…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    }
+   ],
+   "source": [
+    "# Define the plot function  \n",
+    "#\n",
+    "def myplot(xv):\n",
+    "    # calculate x as evenly spaced values within a interval 0 .. xv\n",
+    "    x = arange(0, xv, 0.01)\n",
+    "    # the plot function\n",
+    "    y = sin(pi*x)\n",
+    "\n",
+    "    # NOTE: Matplotlib doesn't work with pixels directly, but rather\n",
+    "    # physical sizes (inch) and DPI. To use pixels for the figures\n",
+    "    # figsize, the DPI of the monitor must be used for re-calculation\n",
+    "    #\n",
+    "    # See: https://www.infobyip.com/detectmonitordpi.php\n",
+    "    \n",
+    "    # DPI of common monitors\n",
+    "    my_dpi=96\n",
+    "    \n",
+    "    # figsize: width|height recalculated from inch to pixels\n",
+    "    plt.figure(figsize=(800/my_dpi, 400/my_dpi), dpi=my_dpi)\n",
+    "    \n",
+    "    # set the grid lines (light-gray)\n",
+    "    plt.grid(axis='x', color='#E0E0E0', linestyle='--', linewidth=2),\n",
+    "    plt.grid(axis='y', color='#E0E0E0', linestyle='-', linewidth=2),\n",
+    "    \n",
+    "    # set the axis labels\n",
+    "    plt.xlabel('x-values'),\n",
+    "    plt.ylabel('y-values'),\n",
+    "    \n",
+    "    # set the plot title\n",
+    "    plt.title('Simple plot function based on sin(x)'),\n",
+    "\n",
+    "    # define the plot\n",
+    "    plt.plot(x, y)\n",
+    "\n",
+    "\n",
+    "# Create an interactive widget for the plot using interact\n",
+    "#\n",
+    "interact = widgets.interact(\n",
+    "    myplot,\n",
+    "    xv = widgets.FloatSlider(\n",
+    "        value=pi,\n",
+    "        min=(pi),\n",
+    "        max=(4*pi),\n",
+    "        step=0.01,\n",
+    "        description='Value (x):',\n",
+    "        layout=Layout(width='99%')\n",
+    "    )\n",
+    ")\n",
+    "\n",
+    "# the semicolon ';' suppress the output\n",
+    "# of the code execution\n",
+    "#\n",
+    "interact;"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### Select box"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 4,
+   "metadata": {},
+   "outputs": [
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "4c5d6ce972e845f6a226b8e15a659886",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "interactive(children=(Dropdown(description='name', options=('Jim', 'Emma', 'Bond'), value='Jim'), Output()), _…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    }
+   ],
+   "source": [
+    "def say_my_name(name):\n",
+    "    \"\"\"\n",
+    "    Print the current widget value in short sentence\n",
+    "    \"\"\"\n",
+    "    print(f'My name is {name}')\n",
+    "\n",
+    "\n",
+    "widgets.interact(\n",
+    "    say_my_name,\n",
+    "    name=[\"Jim\", \"Emma\", \"Bond\"]\n",
+    ");"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### Combined widgets"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 5,
+   "metadata": {},
+   "outputs": [
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "f60f273b2d654b83a4233a6c1ced4bda",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "interactive(children=(Dropdown(description='x', options=(0, 1, 2, 3), value=0), Output()), _dom_classes=('widg…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    },
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "a721bdf7f9874a9b89f024894baeede8",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "interactive(children=(IntSlider(value=5, description='x', max=10), Output()), _dom_classes=('widget-interact',…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    },
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "cf1fa3684e5e4b879168910041c0c750",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "interactive(children=(FloatSlider(value=5.0, description='x', max=10.0, step=0.5), Output()), _dom_classes=('w…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    },
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "91b7e346be3f4ac3baf878bb585b65f4",
+       "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"
+    }
+   ],
+   "source": [
+    "def widget_says(x):\n",
+    "    \"\"\"\n",
+    "    Print the current widget value in short sentence\n",
+    "    \"\"\"\n",
+    "    print(f'Widget says: {x}')\n",
+    "\n",
+    "\n",
+    "widgets.interact(widget_says, x=[0, 1, 2, 3])\n",
+    "widgets.interact(widget_says, x=(0, 10, 1))\n",
+    "widgets.interact(widget_says, x=(0, 10, .5))\n",
+    "\n",
+    "# the variable underscore ('_')) returns the output\n",
+    "# of the latest code execution\n",
+    "#\n",
+    "_ = widgets.interact(widget_says, x=True)"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### Complex widget configs"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 6,
+   "metadata": {},
+   "outputs": [
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "3015a3f9d9c6473893d4ea7d1a35bab6",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "VBox(children=(IntSlider(value=5, description='Slider', layout=Layout(width='99%'), max=10), IntRangeSlider(va…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    }
+   ],
+   "source": [
+    "int_slider = widgets.IntSlider(\n",
+    "    value=5, \n",
+    "    min=0, max=10, step=1, \n",
+    "    description='Slider',\n",
+    "    layout=Layout(width='99%')\n",
+    ")\n",
+    "\n",
+    "int_range_slider = widgets.IntRangeSlider(\n",
+    "    value=(20, 40), \n",
+    "    min=0,\n",
+    "    max=100,\n",
+    "    step=2, \n",
+    "    description='Range Slider',\n",
+    "    layout=Layout(width='99%')\n",
+    ")\n",
+    "\n",
+    "dropdown = widgets.Dropdown(\n",
+    "    value='Feb', \n",
+    "    options=['Jan', 'Feb', 'Mar', 'Apr'], \n",
+    "    description='Dropdown'\n",
+    ")\n",
+    "\n",
+    "radiobuttons = widgets.RadioButtons(\n",
+    "    value='Feb', \n",
+    "    options=['Jan', 'Feb', 'Mar', 'Apr'], \n",
+    "    description='Radio Buttons'\n",
+    ")\n",
+    "\n",
+    "combobox = widgets.Combobox(\n",
+    "    placeholder='start typing... (e.g. L or o)',\n",
+    "    options=['Amsterdam', 'Athens', 'Lisbon', 'London', 'Ljubljana'], \n",
+    "    description='Combo Box'\n",
+    ")\n",
+    "\n",
+    "checkbox = widgets.Checkbox(\n",
+    "    description='Checkbox',\n",
+    "    value=True\n",
+    ")\n",
+    " \n",
+    " \n",
+    "# VBox container to pack all widgets vertically\n",
+    "#\n",
+    "widgets.VBox([\n",
+    "    int_slider, \n",
+    "    int_range_slider, \n",
+    "    dropdown, \n",
+    "    radiobuttons,\n",
+    "    checkbox,\n",
+    "    combobox,\n",
+    "])"
+   ]
+  },
+  {
+   "cell_type": "markdown",
+   "metadata": {},
+   "source": [
+    "### Connected sliders"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 7,
+   "metadata": {},
+   "outputs": [
+    {
+     "data": {
+      "application/vnd.jupyter.widget-view+json": {
+       "model_id": "60de43ae44ba49bc93e188eb9f668ca7",
+       "version_major": 2,
+       "version_minor": 0
+      },
+      "text/plain": [
+       "VBox(children=(IntSlider(value=5, description='Slider 1', layout=Layout(width='99%'), max=10), IntSlider(value…"
+      ]
+     },
+     "metadata": {},
+     "output_type": "display_data"
+    }
+   ],
+   "source": [
+    "sl1 = widgets.IntSlider(\n",
+    "    description='Slider 1',\n",
+    "    min=0,\n",
+    "    max=10,\n",
+    "    layout=Layout(width='99%')\n",
+    ")\n",
+    "sl2 = widgets.IntSlider(\n",
+    "    description='Slider 2',\n",
+    "    min=0,\n",
+    "    max=10,\n",
+    "    layout=Layout(width='99%')\n",
+    ")\n",
+    "link = widgets.link(\n",
+    "    (sl1, 'value'), \n",
+    "    (sl2, 'min')\n",
+    ")\n",
+    "\n",
+    "sl1.value = 5\n",
+    "widgets.VBox([\n",
+    "    sl1, sl2\n",
+    "])"
+   ]
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Python 3 (ipykernel)",
+   "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.9"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 4
+}