CODEWITHSUNDEEP
pythonbokeh
Golanu Delamare
Golanu Delamare

Reputation: 71

Manually change x range for Bokeh plot

So I'm trying to create a Bokeh plot for which I would like to be able to manually adapt the range of the X-Axis with a slider. Being a newbie I've only managed to get this far and despite researching this subject I haven't been able to solve this problem.

Here my code:

from bokeh.layouts import column
from bokeh.models import CustomJS, ColumnDataSource, Slider
from bokeh.plotting import Figure, output_file, show
output_file("test.html")
x = [x*0.5 for x in range(0, 200)]
y = x
source = ColumnDataSource(data=dict(x=x, y=y))
plot = Figure(plot_width=600, plot_height=400, x_range=(0, 100))
plot.line('x', 'y', source=source, line_width=2, line_alpha=0.75)
callback = CustomJS(args=dict(x_range=plot.x_range), code="""
    var start = cb_obj.value
    x_range.set({"start": start, "end": start+10})
""")
slider = Slider (start=0, end=90, value=20, step=10)
slider.js_on_change('value', callback)
layout = column(slider, plot)
show(layout)

My biggest problem is to understand how I connect the CustomJS to my plot. I would gladly appreciate your help.

Upvotes: 1

Views: 7285

Answers (1)

Eugene Pakhomov
Eugene Pakhomov

Reputation: 10652

It has been answered at the Bokeh Google group

To reiterate, the only change needed is to replace x_range.set with x_range.setv.

Upvotes: 1

Related Questions