python bokeh - create a custom pan button

Question

I am just starting with bokeh, and looking forward would like to know if there is a way to implement the following:

I have a financial dataseries last 1 year: I would like to create special tools that allows me to: - a special zoom that on 1 click zoom on the first month - a special zoom/pan that on 1 click move exactly 1 month forward and adjust the height of the chart to the visible data

Would that be possible to implement in bokeh? I assume this would mean tweaking the original zoom/pan definition and create new tools with them.

score 1 · Accepted Answer · answered Apr 04 '17 at 20:12

1

Here is an example using the taptool, would that work for you? Every click looks at a 10 unit interval of the plotting region. To adjust the plot for the data you can find the max and min y values from the source data and change the y range end and start.

from bokeh.models import ColumnDataSource, BoxSelectTool,TapTool, HoverTool
from bokeh.plotting import figure
from bokeh.io import curdoc

source2 = ColumnDataSource(data=dict(x=[0,100],y=[0,100]))

taptool = TapTool()

p = figure(plot_width=400,
           plot_height=400,
           tools=[taptool],
           title="Select Below")

p.circle(x='x',y='y',source=source2)

""" initial x-range is  0, 100"""
p.x_range.start = 0
p.x_range.end = 100

def tool_events_callback(attr, old, new):
    if(p.x_range.end == 100):
        p.x_range.end = p.x_range.start + 10
        p.x_range.start = p.x_range.end - 10
    else:
        p.x_range.start = p.x_range.start + 10
        p.x_range.end = p.x_range.start + 10

p.tool_events.on_change('geometries', tool_events_callback)
p.add_tools(BoxSelectTool(), HoverTool())
curdoc().add_root(p)

answered Apr 04 '17 at 20:12

Anthonydouc

3,334
1
16
29

Hi, thank you for your answer! But I dont think it work. At the moment the function`tool_events_callback` is defined with 3 arguments, but none is passed in when it is called 3 lines from the end. Nothing happens on click /tap. Also, according to your code there is 1 point at 0,0 and 1 at 100,100 is that what you wanted? The chart renders with only those 2 points at the corner bottom left and top right. – jim jarnac Apr 05 '17 at 00:57
You need to run it with bokeh serve --show myapp.py. That is the only way it will respond. And do not worry about tool_events_callback. The data points i put in are largely irrelevant as well its just an example. – Anthonydouc Apr 05 '17 at 07:38
I only started Bokeh few days ago, so pardon my simple questions, but how i can i run `bokeh serve` with jupyter notebook? (that's what i am using) – jim jarnac Apr 05 '17 at 08:16
Oh I see, not exactly sure how to do it in a jupyter notebook. Are you wishing to implement this only in a notebook? Otherwise simply save the code as a standalone python script i.e myapp.py. Then in the command line or terminal type bokeh serve --show myapp.py – Anthonydouc Apr 05 '17 at 08:51
FYI, the newest version of bokeh was just released and they have added a cleaner way to implement the above. https://bokeh.github.io/blog/2017/4/5/release-0-12-5/ look at js_on_event. – Anthonydouc Apr 07 '17 at 17:58
That's great thx. If you have the time, can you have a look at another question i have regarding bokeh? Here: http://stackoverflow.com/questions/43283717/python-bokeh-assign-taptool-to-a-subset-of-glyphs – jim jarnac Apr 07 '17 at 18:29

python bokeh - create a custom pan button

1 Answers1