Link x axes

[nanthony21]

This pull request adds a button towards the end of the page that allow the user to link the x axes of the plots. This is a very useful feature when you want to look at what is going on in multiple plots during a specific time.

I had initially hoped to implement this entirely on the client side in JavaScript but it appears that this is not currently possible in Bokeh. The best working solution that I have found is the following: When the button is clicked a server-side callback is triggered which regenerates the plots and then updates the document. Unfortunately it takes several seconds for the changes to take affect. However, I wanted to open this PR in case there are thoughts on how this can be improved.

This addresses the feature requested in #78

[bkueng]

Thanks for taking a stab at this. As you mention, there are significant drawbacks:

• all plots need to be reloaded, creating delay and additional server load
• all plots are reset
• linking all plots triggers lots of update requests when zooming/panning, adding to the server load. In addition when I tried this, the UI update becomes really slow and unresponsive (I'm testing on a pretty fast Laptop)

I think these issues need to be resolved before I would consider it a usable feature. In particular:

but it appears that this is not currently possible in Bokeh

Did you try this or is it documented somewhere? A potential solution in between would be to update the range from the python callback instead of reloading all plots.

The last issue can be resolved by making the linking more fine-grained: let the user select which plots he/she would like to link.

[nanthony21]

I tried just updating the x_range objects of the plots without regenerating the plots altogether and unfortunately it didn't work. I don't think that it would really matter though, from what I have seen the python callback actually runs pretty quickly. Most of the delay has to do with the plots not refreshing until several seconds after the python callback has completed (maybe this can be fixed in the server settings?).

Did you try this or is it documented somewhere?

I did try it using a CustomJS callback and it didn't work for me. After asking around I eventually got the answer on Gitter that the JS side of Bokeh doesn't have the proper event handling to support range reassignment. Here is a thread showing what I tried for reference: https://groups.google.com/a/continuum.io/forum/#!topic/bokeh/JM3X5YAqmdE

linking all plots triggers lots of update requests when zooming/panning, adding to the server load. In addition when I tried this, the UI update becomes really slow and unresponsive (I'm testing on a pretty fast Laptop)

Maybe I'm mistaken but shouldn't panning and zooming be handled entirely by the client without any need for the server?

[bkueng]

Most of the delay has to do with the plots not refreshing until several seconds after the python callback has completed (maybe this can be fixed in the server settings?)

I'm not aware of any such server settings. I think the delay comes from the fact that the plots need to be reloaded on the browser-side (and this requires heavy JS & DOM processing). Which is why I suggested just changing the range objects. I already use python callbacks, and they are executed fast.

Maybe I'm mistaken but shouldn't panning and zooming be handled entirely by the client without any need for the server?

No, I use server-side dynamic downsampling, which loads new samples at an appropriate resolution from the server as you zoom in or pan.

If you want to push this further, I will support that, but it seems to me that there is quite a bit missing to bring it into usable form. What do you think?

[nanthony21]

If Bokeh introduces a way to swap out ranges without rebuilding the entire plot I think this will be pretty straightforward. For now though it seems like it probably can't be done effectively.