Integrate navigator brain with bokeh

[bcipolli]

bokeh is a Python package for producing interactive browser-based plots on top of bokehjs. The goal here is to seamlessly integrate the roygbiv "navigator" brain with bokeh interactive plots.

As of bokeh/bokeh#2800 , bokeh supports definition of custom widgets. I believe if we can wrap roygbiv into the bokeh framework, then we can brain <-> plot two-way interactive plots easily, and focus development fully in Python

That way, the user could define the data, plots and interactions in Python, and have the html/javascript generated on the fly.

[bcipolli]

Bokeh discussion / questions / advice is happening on a bokeh Google Groups discussion thread.

[binarybottle]

Thank you so much for looking into this, Ben! Do you know if bokehjs is very flexible? We started with box and whisker plots, but would like to incorporate much more interesting interactive plots as well.

[bcipolli]

Trying to figure it out as we go. BokehJS is a stand-alone framework, with plugins for Python, R, etc to be able to generate JS/CSS/HTML code. On the Python side, it also works well with seaborn and matplotlib.

Other frameworks are either pure JS (e.g. D3) or pure Python (e.g. seaborn). I think bokeh/bokehjs is a bit stronger than mpld3.

But I'll update when I learn more!

[bcipolli]

I'm building a dynamic poster for SfN using this stuff, so should come up with some ideas soon. I have a few initial visualization here:
http://cseweb.ucsd.edu/~bcipolli/docs/posters/SfN2015/

My goal is to have the visualizations interact.

[binarybottle]

Very nice work!

[bcipolli]

OK, I understand how to do this now. There's the "clean" way (mostly not possible) and "dirty" way. The "dirty" way is actually not really dirty, just not as elegant as the server idea :)

Clean way: bokeh-server

• bokeh can actually handle dynamic loading of data--and quite elegantly--but it requires running a bokeh-server, a light-weight Python server to stream data when needed.
• This is great and easy if you're running things locally (and I'll use this for my SfN poster), but for a remote web server, most of us won't be able to run a bokeh-server instance (no permissions!)

Dirty way: AjaxDataSource

• bokeh exposes Python-defined data sources (similar to pandas data frames, they say) also in the JS side of things. They have a remote data source for loading json: AjaxDataSource. Yay!
• In bokeh (Python), it is possible to define on a plot a TapTool (click event) that executes CustomJS; the JS has access to the AjaxDataSource. So, in the JS, it's possible to change the URL of the data source, then force retrieval of the data. Simple.
• I am not sure if the data retrieved is raw data or plot-specific data... I believe it's raw data (meaning that the plot should self-update when the raw data is updated!), but need to double-check.

source = AjaxDataSource(data_url=None)
customjs = CustomJS(lang="javascript", code="""
    // cb_obj is the event object; in this case the AjaxDataSource.
    cb_obj.set("data_url", "http://localhost:5051/data"); // change the URL
    cb_obj.get_data('replace'); // force data retrieval
""")

p = figure()
rend = p.circle('x', 'y', source=source)
tap = TapTool(renderers=[rend], callback=customjs)  # define the tap controller for all the plotted points.
p.add_tools(tap)  # add the event handler.

Will try this out soon; if not tomorrow then Monday!

[bcipolli]

P.S. The bokeh docs for this suck. I had to chain this together from nibbles in the mailing list, stackoverflow, a lot of console.log() + trial-and-error.

[binarybottle]

Good sleuthing. Thank you for your efforts, Ben!