2017-10-08 90 views
0

我创建了一个带有散景的绘图,现在尝试向其中添加一些小部件。目前我想用RangeSlider改变X轴,但我认为我在回调中遇到了一些麻烦。附上你发现的代码:使用RangeSlider更改轴范围

import pandas as pd 
import numpy as np 
import bokeh.plotting as bp 
from bokeh.models import CustomJS 
from bokeh.models.widgets import RangeSlider 
from bokeh.layouts import row, widgetbox 
from bokeh.plotting import figure, show, output_file 


df = pd.DataFrame(np.random.randint(0,30,size=(100, 3)), columns=list('ABC')) 
df.index.name ='Numbers' 
dt = bp.ColumnDataSource(df) 

output_file("Plot.html") 

p = figure(title="Example", 
     x_axis_label = "Number", y_axis_label = "Temperature in C", 
     x_range=(0,100)) 

p.line(source=dt, x='Numbers', y='A', color='blue', legend='Line A') 
p.line(source=dt, x='Numbers', y='B', color='red', legend='Line B') 
p.line(source=dt, x='Numbers', y='C', color='green', legend='Line C') 
p.legend.click_policy="hide" 

callback = CustomJS(args=dict(p=p), code=""" 
         var a = cb_obj.value; 
         p.x_range = a; 
         p.change.emit(); 
         """) 

range_slider = RangeSlider(start=0, end=100,value=(2,75), step=1, title="Test") 
range_slider.js_on_change('value', callback) 


layout = row(p,widgetbox(range_slider)) 
show(layout) 

在此先感谢!

回答

0

必须设置startend的范围分别:

callback = CustomJS(args=dict(p=p), code=""" 
    var a = cb_obj.value; 
    p.x_range.start = a[0]; 
    p.x_range.end = a[1]; 
""") 

此外,调用emit是不必要的。

+0

太棒了!非常感谢你! :) – Ailurus