Created
October 25, 2015 12:34
-
-
Save mivade/2c7e647a5b43ff9a97a2 to your computer and use it in GitHub Desktop.
Update Bokeh plots without using the bokeh-server
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
"""Demonstration of using Tornado to send updates to a Bokeh plot | |
without using the bokeh-server. | |
""" | |
import json | |
import numpy.random as npr | |
from tornado.ioloop import IOLoop, PeriodicCallback | |
from tornado.web import Application, RequestHandler | |
from tornado.options import define, options | |
from tornadose.handlers import EventSource | |
from tornadose.stores import QueueStore | |
from bokeh.plotting import figure | |
from bokeh.embed import components | |
define('port', default=5557, help='Default port') | |
store = QueueStore() | |
class MainHandler(RequestHandler): | |
def get(self): | |
fig = gen_plot() | |
self.render('index.html', figure=fig) | |
def gen_plot(): | |
data = npr.random((100, 100)) | |
fig = figure() | |
fig.scatter(data[:,0], data[:,1]) | |
return ''.join(components(fig)) | |
def update_data(): | |
store.submit(json.dumps([npr.random(), npr.random()])) | |
def make_app(): | |
app = Application( | |
[ | |
(r'/', MainHandler), | |
(r'/updates', EventSource, {'store': store}) | |
], | |
debug=True, | |
template_path='.', | |
static_path='.' | |
) | |
return app | |
def main(): | |
options.parse_command_line() | |
app = make_app() | |
app.listen(options.port) | |
loop = IOLoop.instance() | |
PeriodicCallback(update_data, 1000., loop).start() | |
loop.start() | |
if __name__ == "__main__": | |
main() |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<link | |
href="http://cdn.pydata.org/bokeh/release/bokeh-0.10.0.min.css" | |
rel="stylesheet" type="text/css"> | |
<script src="http://cdn.pydata.org/bokeh/release/bokeh-0.10.0.min.js"></script> | |
</head> | |
<body> | |
{% autoescape None %} | |
<div id="container">{{ figure }}</div> | |
<script> | |
var stream; | |
function connect() { | |
stream = new EventSource('/updates'); | |
stream.onmessage = function (message) { | |
updatePlot(message.data); | |
} | |
} | |
function updatePlot(data) { | |
} | |
window.onload = function () { | |
connect(); | |
}; | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I haven't figured out the JS side of things yet, so at the moment this is a lie.