├── Choropleth Map
├── NYC Unemployment rate.ipynb
├── New_York_Unemployment.html
└── readme.md
├── Interactive Data Visualization using Bokeh.ipynb
├── README.md
└── bar.html
/Choropleth Map/readme.md:
--------------------------------------------------------------------------------
1 | #Plotting Unemployment Data in Python using Bokeh
2 |
3 |
4 | ##Downloading **sample data**
5 | ```
6 | import bokeh.sampledata
7 | bokeh.sampledata.download()
8 | ```
9 | [](https://postimg.org/image/5o8r9a4of/)
10 |
11 |
12 | - - - -
13 | ##Bokeh Inline Output: [Choropleth Map]
14 | [](https://postimg.org/image/j50nv18of/)
15 |
16 |
17 |
--------------------------------------------------------------------------------
/Interactive Data Visualization using Bokeh.ipynb:
--------------------------------------------------------------------------------
1 | {
2 | "cells": [
3 | {
4 | "cell_type": "markdown",
5 | "metadata": {},
6 | "source": [
7 | "# Bar graph visualization with Bokeh"
8 | ]
9 | },
10 | {
11 | "cell_type": "code",
12 | "execution_count": 6,
13 | "metadata": {
14 | "collapsed": false
15 | },
16 | "outputs": [],
17 | "source": [
18 | "#Import library\n",
19 | "from bokeh.charts import Bar, output_file, show, output_notebook"
20 | ]
21 | },
22 | {
23 | "cell_type": "code",
24 | "execution_count": 7,
25 | "metadata": {
26 | "collapsed": true
27 | },
28 | "outputs": [],
29 | "source": [
30 | "# prepare data (dummy data)\n",
31 | "data = {\"y\": [1, 2, 3, 4, 5]}"
32 | ]
33 | },
34 | {
35 | "cell_type": "code",
36 | "execution_count": 8,
37 | "metadata": {
38 | "collapsed": true
39 | },
40 | "outputs": [],
41 | "source": [
42 | "# Output to Bar.html or you can show inline\n",
43 | "output_file(\"bar.html\", title=\"bar plot example\") "
44 | ]
45 | },
46 | {
47 | "cell_type": "code",
48 | "execution_count": 9,
49 | "metadata": {
50 | "collapsed": false
51 | },
52 | "outputs": [
53 | {
54 | "data": {
55 | "text/html": [
56 | "\n",
57 | "
\n",
58 | "
\n",
59 | "
Loading BokehJS ... \n",
60 | "
"
61 | ]
62 | },
63 | "metadata": {},
64 | "output_type": "display_data"
65 | },
66 | {
67 | "data": {
68 | "application/javascript": [
69 | "\n",
70 | "(function(global) {\n",
71 | " function now() {\n",
72 | " return new Date();\n",
73 | " }\n",
74 | "\n",
75 | " var force = true;\n",
76 | "\n",
77 | " if (typeof (window._bokeh_onload_callbacks) === \"undefined\" || force === true) {\n",
78 | " window._bokeh_onload_callbacks = [];\n",
79 | " window._bokeh_is_loading = undefined;\n",
80 | " }\n",
81 | "\n",
82 | "\n",
83 | " \n",
84 | " if (typeof (window._bokeh_timeout) === \"undefined\" || force === true) {\n",
85 | " window._bokeh_timeout = Date.now() + 5000;\n",
86 | " window._bokeh_failed_load = false;\n",
87 | " }\n",
88 | "\n",
89 | " var NB_LOAD_WARNING = {'data': {'text/html':\n",
90 | " \"\\n\"+\n",
91 | " \"
\\n\"+\n",
92 | " \"BokehJS does not appear to have successfully loaded. If loading BokehJS from CDN, this \\n\"+\n",
93 | " \"may be due to a slow or bad network connection. Possible fixes:\\n\"+\n",
94 | " \"
\\n\"+\n",
95 | " \"
\\n\"+\n",
96 | " \"re-rerun `output_notebook()` to attempt to load from CDN again, or \\n\"+\n",
97 | " \"use INLINE resources instead, as so: \\n\"+\n",
98 | " \" \\n\"+\n",
99 | " \"
\\n\"+\n",
100 | " \"from bokeh.resources import INLINE\\n\"+\n",
101 | " \"output_notebook(resources=INLINE)\\n\"+\n",
102 | " \"
\\n\"+\n",
103 | " \"
\"}};\n",
104 | "\n",
105 | " function display_loaded() {\n",
106 | " if (window.Bokeh !== undefined) {\n",
107 | " document.getElementById(\"897bc204-c1b1-464e-9874-47d038a03e47\").textContent = \"BokehJS successfully loaded.\";\n",
108 | " } else if (Date.now() < window._bokeh_timeout) {\n",
109 | " setTimeout(display_loaded, 100)\n",
110 | " }\n",
111 | " }\n",
112 | "\n",
113 | " function run_callbacks() {\n",
114 | " window._bokeh_onload_callbacks.forEach(function(callback) { callback() });\n",
115 | " delete window._bokeh_onload_callbacks\n",
116 | " console.info(\"Bokeh: all callbacks have finished\");\n",
117 | " }\n",
118 | "\n",
119 | " function load_libs(js_urls, callback) {\n",
120 | " window._bokeh_onload_callbacks.push(callback);\n",
121 | " if (window._bokeh_is_loading > 0) {\n",
122 | " console.log(\"Bokeh: BokehJS is being loaded, scheduling callback at\", now());\n",
123 | " return null;\n",
124 | " }\n",
125 | " if (js_urls == null || js_urls.length === 0) {\n",
126 | " run_callbacks();\n",
127 | " return null;\n",
128 | " }\n",
129 | " console.log(\"Bokeh: BokehJS not loaded, scheduling load and callback at\", now());\n",
130 | " window._bokeh_is_loading = js_urls.length;\n",
131 | " for (var i = 0; i < js_urls.length; i++) {\n",
132 | " var url = js_urls[i];\n",
133 | " var s = document.createElement('script');\n",
134 | " s.src = url;\n",
135 | " s.async = false;\n",
136 | " s.onreadystatechange = s.onload = function() {\n",
137 | " window._bokeh_is_loading--;\n",
138 | " if (window._bokeh_is_loading === 0) {\n",
139 | " console.log(\"Bokeh: all BokehJS libraries loaded\");\n",
140 | " run_callbacks()\n",
141 | " }\n",
142 | " };\n",
143 | " s.onerror = function() {\n",
144 | " console.warn(\"failed to load library \" + url);\n",
145 | " };\n",
146 | " console.log(\"Bokeh: injecting script tag for BokehJS library: \", url);\n",
147 | " document.getElementsByTagName(\"head\")[0].appendChild(s);\n",
148 | " }\n",
149 | " };var element = document.getElementById(\"897bc204-c1b1-464e-9874-47d038a03e47\");\n",
150 | " if (element == null) {\n",
151 | " console.log(\"Bokeh: ERROR: autoload.js configured with elementid '897bc204-c1b1-464e-9874-47d038a03e47' but no matching script tag was found. \")\n",
152 | " return false;\n",
153 | " }\n",
154 | "\n",
155 | " var js_urls = [\"https://cdn.pydata.org/bokeh/release/bokeh-0.12.4.min.js\", \"https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.4.min.js\"];\n",
156 | "\n",
157 | " var inline_js = [\n",
158 | " function(Bokeh) {\n",
159 | " Bokeh.set_log_level(\"info\");\n",
160 | " },\n",
161 | " \n",
162 | " function(Bokeh) {\n",
163 | " \n",
164 | " document.getElementById(\"897bc204-c1b1-464e-9874-47d038a03e47\").textContent = \"BokehJS is loading...\";\n",
165 | " },\n",
166 | " function(Bokeh) {\n",
167 | " console.log(\"Bokeh: injecting CSS: https://cdn.pydata.org/bokeh/release/bokeh-0.12.4.min.css\");\n",
168 | " Bokeh.embed.inject_css(\"https://cdn.pydata.org/bokeh/release/bokeh-0.12.4.min.css\");\n",
169 | " console.log(\"Bokeh: injecting CSS: https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.4.min.css\");\n",
170 | " Bokeh.embed.inject_css(\"https://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.4.min.css\");\n",
171 | " }\n",
172 | " ];\n",
173 | "\n",
174 | " function run_inline_js() {\n",
175 | " \n",
176 | " if ((window.Bokeh !== undefined) || (force === true)) {\n",
177 | " for (var i = 0; i < inline_js.length; i++) {\n",
178 | " inline_js[i](window.Bokeh);\n",
179 | " }if (force === true) {\n",
180 | " display_loaded();\n",
181 | " }} else if (Date.now() < window._bokeh_timeout) {\n",
182 | " setTimeout(run_inline_js, 100);\n",
183 | " } else if (!window._bokeh_failed_load) {\n",
184 | " console.log(\"Bokeh: BokehJS failed to load within specified timeout.\");\n",
185 | " window._bokeh_failed_load = true;\n",
186 | " } else if (force !== true) {\n",
187 | " var cell = $(document.getElementById(\"897bc204-c1b1-464e-9874-47d038a03e47\")).parents('.cell').data().cell;\n",
188 | " cell.output_area.append_execute_result(NB_LOAD_WARNING)\n",
189 | " }\n",
190 | "\n",
191 | " }\n",
192 | "\n",
193 | " if (window._bokeh_is_loading === 0) {\n",
194 | " console.log(\"Bokeh: BokehJS loaded, going straight to plotting\");\n",
195 | " run_inline_js();\n",
196 | " } else {\n",
197 | " load_libs(js_urls, function() {\n",
198 | " console.log(\"Bokeh: BokehJS plotting callback run at\", now());\n",
199 | " run_inline_js();\n",
200 | " });\n",
201 | " }\n",
202 | "}(this));"
203 | ]
204 | },
205 | "metadata": {},
206 | "output_type": "display_data"
207 | }
208 | ],
209 | "source": [
210 | "# Output option\n",
211 | "output_notebook()"
212 | ]
213 | },
214 | {
215 | "cell_type": "markdown",
216 | "metadata": {},
217 | "source": [
218 | "# "
219 | ]
220 | },
221 | {
222 | "cell_type": "code",
223 | "execution_count": 10,
224 | "metadata": {
225 | "collapsed": true
226 | },
227 | "outputs": [],
228 | "source": [
229 | "# create a new line chat with a title and axis labels\n",
230 | "out = Bar(data, title=\"Bar Chart Example\", xlabel='x', ylabel='values', width=400, height=400)"
231 | ]
232 | },
233 | {
234 | "cell_type": "code",
235 | "execution_count": 12,
236 | "metadata": {
237 | "collapsed": false
238 | },
239 | "outputs": [
240 | {
241 | "data": {
242 | "text/html": [
243 | "\n",
244 | "\n",
245 | " \n",
246 | "
\n",
247 | "
\n",
248 | ""
384 | ]
385 | },
386 | "metadata": {},
387 | "output_type": "display_data"
388 | }
389 | ],
390 | "source": [
391 | "# show the result in new webpage + inline in ipy notebook\n",
392 | "show(out)"
393 | ]
394 | },
395 | {
396 | "cell_type": "markdown",
397 | "metadata": {},
398 | "source": [
399 | "### Inline plot in notebook"
400 | ]
401 | },
402 | {
403 | "cell_type": "markdown",
404 | "metadata": {},
405 | "source": [
406 | "## "
407 | ]
408 | },
409 | {
410 | "cell_type": "markdown",
411 | "metadata": {},
412 | "source": [
413 | "## Output file is saved as \"bar.html\" in local drive"
414 | ]
415 | },
416 | {
417 | "cell_type": "markdown",
418 | "metadata": {},
419 | "source": [
420 | "## "
421 | ]
422 | },
423 | {
424 | "cell_type": "markdown",
425 | "metadata": {},
426 | "source": [
427 | "## above output is embedded using \"!.[demo].(image url)\" ipython markdown"
428 | ]
429 | },
430 | {
431 | "cell_type": "code",
432 | "execution_count": null,
433 | "metadata": {
434 | "collapsed": true
435 | },
436 | "outputs": [],
437 | "source": []
438 | }
439 | ],
440 | "metadata": {
441 | "kernelspec": {
442 | "display_name": "Python 3",
443 | "language": "python",
444 | "name": "python3"
445 | },
446 | "language_info": {
447 | "codemirror_mode": {
448 | "name": "ipython",
449 | "version": 3
450 | },
451 | "file_extension": ".py",
452 | "mimetype": "text/x-python",
453 | "name": "python",
454 | "nbconvert_exporter": "python",
455 | "pygments_lexer": "ipython3",
456 | "version": "3.5.2"
457 | }
458 | },
459 | "nbformat": 4,
460 | "nbformat_minor": 1
461 | }
462 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # Interactive-Data-Visualization-using-Bokeh---Python
2 | Using Bokeh python library for interactive visualization which uses **web browsers** for representation of graphs.
3 |
4 | [](https://postimg.cc/3d32rCrr)
5 |
6 | This notebook shows creation of interactive graphs with [Bokeh Library](http://bokeh.pydata.org/en/latest/docs/installation.html)
7 |
8 | * Install `pip3 install bohek` to install the source Bokeh library.
9 |
10 | [](https://postimg.cc/6ytSctyz)
11 |
12 | - - - -
13 |
14 |
15 |
16 | ##Importing library for bar data
17 | ```
18 | from bokeh.charts import Bar, output_file, show, output_notebook
19 | ```
20 |
21 |
22 | - - - -
23 | ##Bokeh Inline Output1: [Bar Graph]
24 | [](https://postimg.cc/image/npmu9ysdr/)
25 |
26 | [](https://postimg.cc/image/u21zjsvfz/)
27 |
28 | - - - -
29 |
30 | ##Bokeh Local Output2: [Bar.html]
31 | [](https://postimg.cc/image/qn60yfvvz/)
32 |
33 |
34 | - - - -
35 |
36 | ##Bokeh Inline Output3: [Choropleth Map]
37 | [](https://postimg.cc/LnHZFt2t)
38 |
39 |
--------------------------------------------------------------------------------
/bar.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | bar plot example
7 |
8 |
9 |
10 |
11 |
14 |
25 |
26 |
27 |
28 |
31 |
32 |
47 |
48 |
--------------------------------------------------------------------------------