{ "cells": [ { "cell_type": "markdown", "metadata": {}, "source": [ "# Interactive Data Visualization with Bokeh\n", "\n", "[Bokeh](http://bokeh.pydata.org/en/latest/) is an interactive Python library for visualizations that targets modern web browsers for presentation. Its goal is to provide elegant, concise construction of novel graphics in the style of D3.js, and to extend this capability with high-performance interactivity over very large or streaming datasets. Bokeh can help anyone who would like to quickly and easily create interactive plots, dashboards, and data applications.\n", "\n", " - To get started using Bokeh to make your visualizations, see the [User Guide](http://bokeh.pydata.org/en/latest/docs/user_guide.html#userguide).\n", " - To see examples of how you might use Bokeh with your own data, check out the [Gallery](http://bokeh.pydata.org/en/latest/docs/gallery.html#gallery).\n", " - A complete API reference of Bokeh is at [Reference Guide](http://bokeh.pydata.org/en/latest/docs/reference.html#refguide).\n", "\n", "The following notebook is intended to illustrate some of Bokeh's interactive utilities and is based on a [post](https://demo.bokehplots.com/apps/gapminder) by software engineer and Bokeh developer [Sarah Bird](https://twitter.com/birdsarah).\n", "\n", "\n", "## Recreating Gapminder's \"The Health and Wealth of Nations\" \n", "\n", "Gapminder started as a spin-off from Professor Hans Rosling’s teaching at the Karolinska Institute in Stockholm. Having encountered broad ignorance about the rapid health improvement in Asia, he wanted to measure that lack of awareness among students and professors. He presented the surprising results from his so-called “Chimpanzee Test” in [his first TED-talk](https://www.ted.com/talks/hans_rosling_shows_the_best_stats_you_ve_ever_seen) in 2006.\n", "\n", "[](http://www.youtube.com/watch?v=hVimVzgtD6w \"The best stats you've ever seen | Hans Rosling\")\n", "\n", "Rosling's interactive [\"Health and Wealth of Nations\" visualization](http://www.gapminder.org/world) has since become an iconic illustration of how our assumptions about ‘first world’ and ‘third world’ countries can betray us. Mike Bostock has [recreated the visualization using D3.js](https://bost.ocks.org/mike/nations/), and in this lab, we will see that it is also possible to use Bokeh to recreate the interactive visualization in Python.\n", "\n", "\n", "### About Bokeh Widgets\n", "Widgets are interactive controls that can be added to Bokeh applications to provide a front end user interface to a visualization. They can drive new computations, update plots, and connect to other programmatic functionality. When used with the [Bokeh server](http://bokeh.pydata.org/en/latest/docs/user_guide/server.html), widgets can run arbitrary Python code, enabling complex applications. Widgets can also be used without the Bokeh server in standalone HTML documents through the browser’s Javascript runtime.\n", "\n", "To use widgets, you must add them to your document and define their functionality. Widgets can be added directly to the document root or nested inside a layout. There are two ways to program a widget’s functionality:\n", "\n", " - Use the CustomJS callback (see [CustomJS for Widgets](http://bokeh.pydata.org/en/0.12.0/docs/user_guide/interaction.html#userguide-interaction-actions-widget-callbacks). This will work in standalone HTML documents.\n", " - Use `bokeh serve` to start the Bokeh server and set up event handlers with `.on_change` (or for some widgets, `.on_click`).\n", " \n", "### Imports" ] }, { "cell_type": "code", "execution_count": 15, "metadata": { "collapsed": true }, "outputs": [], "source": [ "# Science Stack \n", "import numpy as np\n", "import pandas as pd\n", "\n", "# Bokeh Essentials \n", "from bokeh.io import output_notebook\n", "from bokeh.plotting import figure, show, ColumnDataSource\n", "\n", "# Layouts \n", "from bokeh.layouts import layout\n", "from bokeh.layouts import widgetbox\n", "\n", "# Figure interaction layer\n", "from bokeh.io import show\n", "from bokeh.io import output_notebook \n", "\n", "# Data models for visualization \n", "from bokeh.models import Text\n", "from bokeh.models import Plot\n", "from bokeh.models import Slider\n", "from bokeh.models import Circle\n", "from bokeh.models import Range1d\n", "from bokeh.models import CustomJS\n", "from bokeh.models import HoverTool\n", "from bokeh.models import LinearAxis\n", "from bokeh.models import ColumnDataSource\n", "from bokeh.models import SingleIntervalTicker\n", "\n", "# Palettes and colors\n", "from bokeh.palettes import brewer\n", "from bokeh.palettes import Spectral6" ] }, { "cell_type": "markdown", "metadata": {}, "source": [ "To display Bokeh plots inline in a Jupyter notebook, use the `output_notebook()` function from bokeh.io. When `show()` is called, the plot will be displayed inline in the next notebook output cell. To save your Bokeh plots, you can use the `output_file()` function instead (or in addition). The `output_file()` function will write an HTML file to disk that can be opened in a browser. " ] }, { "cell_type": "code", "execution_count": 2, "metadata": { "collapsed": false }, "outputs": [ { "data": { "text/html": [ "\n", "
" ] }, "metadata": {}, "output_type": "display_data" }, { "data": { "application/javascript": [ "\n", "(function(global) {\n", " function now() {\n", " return new Date();\n", " }\n", "\n", " var force = \"1\";\n", "\n", " if (typeof (window._bokeh_onload_callbacks) === \"undefined\" || force !== \"\") {\n", " window._bokeh_onload_callbacks = [];\n", " window._bokeh_is_loading = undefined;\n", " }\n", "\n", "\n", " \n", " if (typeof (window._bokeh_timeout) === \"undefined\" || force !== \"\") {\n", " window._bokeh_timeout = Date.now() + 5000;\n", " window._bokeh_failed_load = false;\n", " }\n", "\n", " var NB_LOAD_WARNING = {'data': {'text/html':\n", " \"\\n\"+\n", " \"BokehJS does not appear to have successfully loaded. If loading BokehJS from CDN, this \\n\"+\n", " \"may be due to a slow or bad network connection. Possible fixes:\\n\"+\n", " \"
\\n\"+\n", " \"\\n\"+\n",
" \"from bokeh.resources import INLINE\\n\"+\n",
" \"output_notebook(resources=INLINE)\\n\"+\n",
" \"\\n\"+\n",
" \"