Skip to content

Commit 3608755

Browse files
committed
practicing using bokeh
1 parent df7681c commit 3608755

File tree

3 files changed

+190
-0
lines changed

3 files changed

+190
-0
lines changed

data_visualization_bokeh/demo.html

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
2+
3+
4+
5+
<!DOCTYPE html>
6+
<html lang="en">
7+
8+
<head>
9+
10+
<meta charset="utf-8">
11+
<title>Bokeh Plot</title>
12+
13+
14+
15+
16+
17+
18+
19+
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-1.3.4.min.js"></script>
20+
<script type="text/javascript">
21+
Bokeh.set_log_level("info");
22+
</script>
23+
24+
25+
26+
27+
</head>
28+
29+
30+
<body>
31+
32+
33+
34+
35+
36+
37+
<div class="bk-root" id="af99e02b-c2fc-45de-8b78-e27a2373e42f" data-root-id="4155"></div>
38+
39+
40+
41+
42+
43+
<script type="application/json" id="4381">
44+
{"0770ac4c-45d7-4cd1-8a45-92cc5c0997cb":{"roots":{"references":[{"attributes":{},"id":"4179","type":"HelpTool"},{"attributes":{"base":24,"mantissas":[1,2,4,6,8,12],"max_interval":43200000.0,"min_interval":3600000.0,"num_minor_ticks":0},"id":"4200","type":"AdaptiveTicker"},{"attributes":{"days":[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31]},"id":"4201","type":"DaysTicker"},{"attributes":{},"id":"4174","type":"PanTool"},{"attributes":{},"id":"4175","type":"WheelZoomTool"},{"attributes":{"base":60,"mantissas":[1,2,5,10,15,20,30],"max_interval":1800000.0,"min_interval":1000.0,"num_minor_ticks":0},"id":"4199","type":"AdaptiveTicker"},{"attributes":{},"id":"4209","type":"YearsTicker"},{"attributes":{},"id":"4177","type":"SaveTool"},{"attributes":{"days":[1,4,7,10,13,16,19,22,25,28]},"id":"4202","type":"DaysTicker"},{"attributes":{},"id":"4178","type":"ResetTool"},{"attributes":{"months":[0,6]},"id":"4208","type":"MonthsTicker"},{"attributes":{"formatter":{"id":"4195","type":"BasicTickFormatter"},"ticker":{"id":"4170","type":"BasicTicker"}},"id":"4169","type":"LinearAxis"},{"attributes":{"num_minor_ticks":5,"tickers":[{"id":"4198","type":"AdaptiveTicker"},{"id":"4199","type":"AdaptiveTicker"},{"id":"4200","type":"AdaptiveTicker"},{"id":"4201","type":"DaysTicker"},{"id":"4202","type":"DaysTicker"},{"id":"4203","type":"DaysTicker"},{"id":"4204","type":"DaysTicker"},{"id":"4205","type":"MonthsTicker"},{"id":"4206","type":"MonthsTicker"},{"id":"4207","type":"MonthsTicker"},{"id":"4208","type":"MonthsTicker"},{"id":"4209","type":"YearsTicker"}]},"id":"4165","type":"DatetimeTicker"},{"attributes":{"bottom":{"value":0},"fill_alpha":{"value":0.1},"fill_color":{"value":"#1f77b4"},"left":{"field":"left"},"line_alpha":{"value":0.1},"line_color":{"value":"#1f77b4"},"right":{"field":"right"},"top":{"value":1}},"id":"4189","type":"Quad"},{"attributes":{"active_drag":"auto","active_inspect":"auto","active_multi":null,"active_scroll":"auto","active_tap":"auto","tools":[{"id":"4174","type":"PanTool"},{"id":"4175","type":"WheelZoomTool"},{"id":"4176","type":"BoxZoomTool"},{"id":"4177","type":"SaveTool"},{"id":"4178","type":"ResetTool"},{"id":"4179","type":"HelpTool"}]},"id":"4180","type":"Toolbar"},{"attributes":{"days":[1,15]},"id":"4204","type":"DaysTicker"},{"attributes":{"bottom_units":"screen","fill_alpha":{"value":0.5},"fill_color":{"value":"lightgrey"},"left_units":"screen","level":"overlay","line_alpha":{"value":1.0},"line_color":{"value":"black"},"line_dash":[4,4],"line_width":{"value":2},"render_mode":"css","right_units":"screen","top_units":"screen"},"id":"4210","type":"BoxAnnotation"},{"attributes":{"data_source":{"id":"4187","type":"ColumnDataSource"},"glyph":{"id":"4188","type":"Quad"},"hover_glyph":null,"muted_glyph":null,"nonselection_glyph":{"id":"4189","type":"Quad"},"selection_glyph":null,"view":{"id":"4191","type":"CDSView"}},"id":"4190","type":"GlyphRenderer"},{"attributes":{"formatter":{"id":"4197","type":"DatetimeTickFormatter"},"ticker":{"id":"4165","type":"DatetimeTicker"}},"id":"4164","type":"DatetimeAxis"},{"attributes":{"mantissas":[1,2,5],"max_interval":500.0,"num_minor_ticks":0},"id":"4198","type":"AdaptiveTicker"},{"attributes":{},"id":"4162","type":"LinearScale"},{"attributes":{},"id":"4195","type":"BasicTickFormatter"},{"attributes":{"dimension":1,"ticker":{"id":"4170","type":"BasicTicker"}},"id":"4173","type":"Grid"},{"attributes":{"ticker":{"id":"4165","type":"DatetimeTicker"}},"id":"4168","type":"Grid"},{"attributes":{"days":[1,8,15,22]},"id":"4203","type":"DaysTicker"},{"attributes":{"bottom":{"value":0},"fill_color":{"value":"#B3DE69"},"left":{"field":"left"},"line_color":{"value":"#B3DE69"},"right":{"field":"right"},"top":{"value":1}},"id":"4188","type":"Quad"},{"attributes":{"callback":null},"id":"4158","type":"DataRange1d"},{"attributes":{},"id":"4170","type":"BasicTicker"},{"attributes":{},"id":"4197","type":"DatetimeTickFormatter"},{"attributes":{"source":{"id":"4187","type":"ColumnDataSource"}},"id":"4191","type":"CDSView"},{"attributes":{},"id":"4160","type":"LinearScale"},{"attributes":{"overlay":{"id":"4210","type":"BoxAnnotation"}},"id":"4176","type":"BoxZoomTool"},{"attributes":{"callback":null,"data":{"left":[1587490042580.655,1587490063219.686,1587490067325.979,1587490076788.085,1587490076976.958,1587490080064.388,1587490080404.491,1587490102787.904,1587490115587.78,1587490120839.862,1587490121285.047],"right":[1587490060645.709,1587490066557.647,1587490076756.742,1587490076943.2349,1587490077028.1812,1587490080341.762,1587490088180.418,1587490114245.816,1587490118900.711,1587490121236.044,1587490128316.563]},"selected":{"id":"4211","type":"Selection"},"selection_policy":{"id":"4212","type":"UnionRenderers"}},"id":"4187","type":"ColumnDataSource"},{"attributes":{"months":[0,4,8]},"id":"4207","type":"MonthsTicker"},{"attributes":{},"id":"4211","type":"Selection"},{"attributes":{},"id":"4212","type":"UnionRenderers"},{"attributes":{"callback":null},"id":"4156","type":"DataRange1d"},{"attributes":{"months":[0,2,4,6,8,10]},"id":"4206","type":"MonthsTicker"},{"attributes":{"below":[{"id":"4164","type":"DatetimeAxis"}],"center":[{"id":"4168","type":"Grid"},{"id":"4173","type":"Grid"}],"left":[{"id":"4169","type":"LinearAxis"}],"plot_height":500,"plot_width":1000,"renderers":[{"id":"4190","type":"GlyphRenderer"}],"title":{"id":"4193","type":"Title"},"toolbar":{"id":"4180","type":"Toolbar"},"x_range":{"id":"4156","type":"DataRange1d"},"x_scale":{"id":"4160","type":"LinearScale"},"y_range":{"id":"4158","type":"DataRange1d"},"y_scale":{"id":"4162","type":"LinearScale"}},"id":"4155","subtype":"Figure","type":"Plot"},{"attributes":{"text":""},"id":"4193","type":"Title"},{"attributes":{"months":[0,1,2,3,4,5,6,7,8,9,10,11]},"id":"4205","type":"MonthsTicker"}],"root_ids":["4155"]},"title":"Bokeh Application","version":"1.3.4"}}
45+
</script>
46+
<script type="text/javascript">
47+
(function() {
48+
var fn = function() {
49+
Bokeh.safely(function() {
50+
(function(root) {
51+
function embed_document(root) {
52+
53+
var docs_json = document.getElementById('4381').textContent;
54+
var render_items = [{"docid":"0770ac4c-45d7-4cd1-8a45-92cc5c0997cb","roots":{"4155":"af99e02b-c2fc-45de-8b78-e27a2373e42f"}}];
55+
root.Bokeh.embed.embed_items(docs_json, render_items);
56+
57+
}
58+
if (root.Bokeh !== undefined) {
59+
embed_document(root);
60+
} else {
61+
var attempts = 0;
62+
var timer = setInterval(function(root) {
63+
if (root.Bokeh !== undefined) {
64+
embed_document(root);
65+
clearInterval(timer);
66+
}
67+
attempts++;
68+
if (attempts > 100) {
69+
console.log("Bokeh: ERROR: Unable to run BokehJS code because BokehJS library is missing");
70+
clearInterval(timer);
71+
}
72+
}, 10, root)
73+
}
74+
})(window);
75+
});
76+
};
77+
if (document.readyState != "loading") fn();
78+
else document.addEventListener("DOMContentLoaded", fn);
79+
})();
80+
</script>
81+
82+
</body>
83+
84+
</html>

data_visualization_bokeh/demo.py

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import pandas as pd
2+
from math import pi
3+
from datetime import datetime as dt
4+
from bokeh.io import output_file
5+
from bokeh.plotting import show
6+
from bokeh.models import DatetimeTickFormatter
7+
from bokeh.plotting import figure
8+
9+
df = pd.DataFrame(data=[1,2,3],
10+
index=[dt(2015, 1, 1), dt(2015, 1, 2), dt(2015, 1, 3)],
11+
columns=['foo'])
12+
p = figure(plot_width=400, plot_height=400)
13+
p.line(df.index, df['foo'])
14+
p.xaxis.formatter=DatetimeTickFormatter(
15+
hours=["%d %B %Y"],
16+
days=["%d %B %Y"],
17+
months=["%d %B %Y"],
18+
years=["%d %B %Y"],
19+
)
20+
p.xaxis.major_label_orientation = pi/4
21+
output_file('myplot.html')
22+
show(p)

data_visualization_bokeh/myplot.html

Lines changed: 84 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,84 @@
1+
2+
3+
4+
5+
<!DOCTYPE html>
6+
<html lang="en">
7+
8+
<head>
9+
10+
<meta charset="utf-8">
11+
<title>Bokeh Plot</title>
12+
13+
14+
15+
16+
17+
18+
19+
<script type="text/javascript" src="https://cdn.pydata.org/bokeh/release/bokeh-1.3.4.min.js"></script>
20+
<script type="text/javascript">
21+
Bokeh.set_log_level("info");
22+
</script>
23+
24+
25+
26+
27+
</head>
28+
29+
30+
<body>
31+
32+
33+
34+
35+
36+
37+
<div class="bk-root" id="26fdf7ee-23e7-468a-975b-51f5e50fa14c" data-root-id="1210"></div>
38+
39+
40+
41+
42+
43+
<script type="application/json" id="1321">
44+
{"08b92a51-c425-44d1-9ef3-303aee24181d":{"roots":{"references":[{"attributes":{},"id":"1215","type":"LinearScale"},{"attributes":{},"id":"1230","type":"WheelZoomTool"},{"attributes":{"callback":null,"data":{"x":{"__ndarray__":"AAAAqyyqdEIAAMAQf6p0QgAAgHbRqnRC","dtype":"float64","shape":[3]},"y":[1,2,3]},"selected":{"id":"1254","type":"Selection"},"selection_policy":{"id":"1255","type":"UnionRenderers"}},"id":"1242","type":"ColumnDataSource"},{"attributes":{},"id":"1217","type":"LinearScale"},{"attributes":{"formatter":{"id":"1247","type":"DatetimeTickFormatter"},"major_label_orientation":0.7853981633974483,"ticker":{"id":"1220","type":"BasicTicker"}},"id":"1219","type":"LinearAxis"},{"attributes":{"line_alpha":0.1,"line_color":"#1f77b4","x":{"field":"x"},"y":{"field":"y"}},"id":"1244","type":"Line"},{"attributes":{"ticker":{"id":"1220","type":"BasicTicker"}},"id":"1223","type":"Grid"},{"attributes":{"data_source":{"id":"1242","type":"ColumnDataSource"},"glyph":{"id":"1243","type":"Line"},"hover_glyph":null,"muted_glyph":null,"nonselection_glyph":{"id":"1244","type":"Line"},"selection_glyph":null,"view":{"id":"1246","type":"CDSView"}},"id":"1245","type":"GlyphRenderer"},{"attributes":{},"id":"1255","type":"UnionRenderers"},{"attributes":{},"id":"1254","type":"Selection"},{"attributes":{"bottom_units":"screen","fill_alpha":{"value":0.5},"fill_color":{"value":"lightgrey"},"left_units":"screen","level":"overlay","line_alpha":{"value":1.0},"line_color":{"value":"black"},"line_dash":[4,4],"line_width":{"value":2},"render_mode":"css","right_units":"screen","top_units":"screen"},"id":"1256","type":"BoxAnnotation"},{"attributes":{},"id":"1234","type":"HelpTool"},{"attributes":{},"id":"1229","type":"PanTool"},{"attributes":{"overlay":{"id":"1256","type":"BoxAnnotation"}},"id":"1231","type":"BoxZoomTool"},{"attributes":{"days":["%d %B %Y"],"hours":["%d %B %Y"],"months":["%d %B %Y"],"years":["%d %B %Y"]},"id":"1247","type":"DatetimeTickFormatter"},{"attributes":{"dimension":1,"ticker":{"id":"1225","type":"BasicTicker"}},"id":"1228","type":"Grid"},{"attributes":{"formatter":{"id":"1251","type":"BasicTickFormatter"},"ticker":{"id":"1225","type":"BasicTicker"}},"id":"1224","type":"LinearAxis"},{"attributes":{"below":[{"id":"1219","type":"LinearAxis"}],"center":[{"id":"1223","type":"Grid"},{"id":"1228","type":"Grid"}],"left":[{"id":"1224","type":"LinearAxis"}],"plot_height":400,"plot_width":400,"renderers":[{"id":"1245","type":"GlyphRenderer"}],"title":{"id":"1249","type":"Title"},"toolbar":{"id":"1235","type":"Toolbar"},"x_range":{"id":"1211","type":"DataRange1d"},"x_scale":{"id":"1215","type":"LinearScale"},"y_range":{"id":"1213","type":"DataRange1d"},"y_scale":{"id":"1217","type":"LinearScale"}},"id":"1210","subtype":"Figure","type":"Plot"},{"attributes":{},"id":"1251","type":"BasicTickFormatter"},{"attributes":{},"id":"1232","type":"SaveTool"},{"attributes":{"line_color":"#1f77b4","x":{"field":"x"},"y":{"field":"y"}},"id":"1243","type":"Line"},{"attributes":{"active_drag":"auto","active_inspect":"auto","active_multi":null,"active_scroll":"auto","active_tap":"auto","tools":[{"id":"1229","type":"PanTool"},{"id":"1230","type":"WheelZoomTool"},{"id":"1231","type":"BoxZoomTool"},{"id":"1232","type":"SaveTool"},{"id":"1233","type":"ResetTool"},{"id":"1234","type":"HelpTool"}]},"id":"1235","type":"Toolbar"},{"attributes":{"text":""},"id":"1249","type":"Title"},{"attributes":{"callback":null},"id":"1211","type":"DataRange1d"},{"attributes":{"source":{"id":"1242","type":"ColumnDataSource"}},"id":"1246","type":"CDSView"},{"attributes":{},"id":"1233","type":"ResetTool"},{"attributes":{"callback":null},"id":"1213","type":"DataRange1d"},{"attributes":{},"id":"1225","type":"BasicTicker"},{"attributes":{},"id":"1220","type":"BasicTicker"}],"root_ids":["1210"]},"title":"Bokeh Application","version":"1.3.4"}}
45+
</script>
46+
<script type="text/javascript">
47+
(function() {
48+
var fn = function() {
49+
Bokeh.safely(function() {
50+
(function(root) {
51+
function embed_document(root) {
52+
53+
var docs_json = document.getElementById('1321').textContent;
54+
var render_items = [{"docid":"08b92a51-c425-44d1-9ef3-303aee24181d","roots":{"1210":"26fdf7ee-23e7-468a-975b-51f5e50fa14c"}}];
55+
root.Bokeh.embed.embed_items(docs_json, render_items);
56+
57+
}
58+
if (root.Bokeh !== undefined) {
59+
embed_document(root);
60+
} else {
61+
var attempts = 0;
62+
var timer = setInterval(function(root) {
63+
if (root.Bokeh !== undefined) {
64+
embed_document(root);
65+
clearInterval(timer);
66+
}
67+
attempts++;
68+
if (attempts > 100) {
69+
console.log("Bokeh: ERROR: Unable to run BokehJS code because BokehJS library is missing");
70+
clearInterval(timer);
71+
}
72+
}, 10, root)
73+
}
74+
})(window);
75+
});
76+
};
77+
if (document.readyState != "loading") fn();
78+
else document.addEventListener("DOMContentLoaded", fn);
79+
})();
80+
</script>
81+
82+
</body>
83+
84+
</html>

0 commit comments

Comments
 (0)