Skip to content

Instantly share code, notes, and snippets.

@lenamax2355

lenamax2355/HvplotInteractive.ipynb

Forked from MarcSkovMadsen/HvplotInteractive.ipynb
Created March 2, 2022 09:12
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save lenamax2355/96d2c5ab1f8a433ec3079c5b8a0b41b8 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save lenamax2355/96d2c5ab1f8a433ec3079c5b8a0b41b8 to your computer and use it in GitHub Desktop.
Download ZIP
HvplotInteractive.ipynb
Display the source blob
Display the rendered blob
Raw
HvplotInteractive.ipynb
{
"cells": [
{
"cell_type": "markdown",
"metadata": {},
"source": [
"# Turn your Pandas pipelines into data apps with hvplot `.interactive`"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"# !pip install panel hvplot pandas scipy matplotlib"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"import pandas as pd\n",
"import hvplot.pandas # Adds .hvplot and .interactive methods to Pandas dataframes\n",
"import panel as pn # Panel is a simple, flexible and enterprise-ready data app framework\n",
"\n",
"pn.extension(sizing_mode=\"stretch_width\")\n",
"pd.set_option(\"precision\", 0)\n",
"\n",
"PALETTE = [\"#ff6f69\", \"#ffcc5c\", \"#88d8b0\", ]\n",
"ACCENT_BASE_COLOR = PALETTE[0]"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"**load the data ...**"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"try:\n",
" seattle_bikes = pd.read_csv(\"seattle_bikes.csv\", parse_dates=[\"Date\"]).set_index(\"Date\")\n",
"except FileNotFoundError:\n",
" seattle_bikes = pd.read_csv(\"https://data.seattle.gov/api/views/65db-xm6k/rows.csv?accessType=DOWNLOAD\", parse_dates=[\"Date\"]).set_index(\"Date\")\n",
" seattle_bikes.to_csv(\"seattle_bikes.csv\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Define your Pipeline"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"def pipeline(seattle_bikes=seattle_bikes, frequency=\"D\", window=50, center=True, win_type=\"gaussian\", std=10):\n",
" return (\n",
" seattle_bikes\n",
" .resample(frequency)\n",
" .sum()\n",
" .rolling(window, center=center, win_type=win_type)\n",
" .sum(std=std)\n",
" .dropna()\n",
" )\n",
"pipeline(frequency=\"W\").head(2)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Define your Widgets!\n",
"\n",
"You can find the widget reference guides [here](https://panel.holoviz.org/reference/index.html#widgets)."
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"frequency = pn.widgets.Select(value=\"D\", options=[\"D\", \"W\", \"M\"], name=\"Sampling Frequency\")\n",
"window = pn.widgets.IntSlider(value=50, start=10, end=100, name=\"Rolling Window Length\")\n",
"center = pn.widgets.Checkbox(value=True, name=\"Center\")\n",
"win_type = pn.widgets.Select(value=\"gaussian\", options=[None, \"gaussian\"], name=\"Window Type\")\n",
"std = pn.widgets.IntSlider(value=10, start=5, end=20, name=\"std\")"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Create an Interactive Pipeline With Widgets!"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"ipipeline = pipeline(seattle_bikes.interactive(), frequency=frequency, window=window, center=center, win_type=win_type, std=std)"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Make `.head` Interactive!"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"nrows = pn.widgets.IntSlider(value=5, start=1, end=10, name=\"Rows\")\n",
"ihead = ipipeline.head(nrows)\n",
"ihead"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Make `.plot` Interactive"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"line_width = pn.widgets.IntSlider(value=6, start=1, end=10, name=\"Line Width\")\n",
"iplot = ipipeline.plot(color=PALETTE, figsize=(15,4), title=\"Seatle Bike Data with Matplotlib and hvplot .interactive\", lw=line_width)\n",
"iplot"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Make `.hvplot` Interactive!\n",
"\n",
"`.hvplot` is a Pandas `.plot` drop in replacement that that creates beautiful, interactive plots for the browser."
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"ihvplot = ipipeline.hvplot(responsive=True, min_height=400, color=PALETTE, line_width=line_width, yformatter=\"%.0f\", title=\"Seatle Bike Data with Bokeh and hvplot .interactive\")\n",
"ihvplot"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Make Anything Interactive with `.pipe`"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Make a Function Interactive"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"def message(seattle_bikes, nrows):\n",
" return f\"\"\"With a resampling frequency of **{frequency.value}** and window length of **{window.value}**, the aggregated dataframe contains **{len(seattle_bikes)}** rows. Below we show the first **{nrows}** rows.\"\"\"\n",
"\n",
"imessage = ipipeline.pipe(message, nrows=nrows)\n",
"imessage"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"### Make a Class Interactive\n",
"\n",
"Coming up"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"## Layout the Data App"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": [
"pn.template.FastListTemplate(\n",
" site=\"\", title=\"Turn your pipelines into data apps with hvplot .interactive and Panel\",\n",
" sidebar=[nrows, frequency, window, center, window, std, line_width],\n",
" main=[imessage.panel(), ihead.panel(), iplot.panel(), ihvplot.panel()], \n",
" accent_base_color=ACCENT_BASE_COLOR,header_background=ACCENT_BASE_COLOR,\n",
").servable();"
]
},
{
"cell_type": "markdown",
"metadata": {},
"source": [
"You can **serve the app** with `panel serve HvplotInteractive.ipynb`. Add `--autoreload` for *hot reloading* while developing. The app is available at [http://localhost:5006/HvplotInteractive](http://localhost:5006/HvplotInteractive).\n",
"\n",
"- For previewing the app in Jupyter lab check out the [Panel Jupyter Lab Preview](https://blog.holoviz.org/panel_0.12.0.html#JupyterLab-previews).\n",
"- For deployment options check out the [Server Deployment User Guide](https://panel.holoviz.org/user_guide/Server_Deployment.html)."
]
}
],
"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.8.4"
}
},
"nbformat": 4,
"nbformat_minor": 4
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment