如何在Bokeh / Python / Pywidgets中制作一个滑块/小部件更新多个图?

时间:2017-11-09 05:55:03

标签: javascript python jupyter-notebook bokeh ipywidgets

使用Jupyter笔记本,如何让一个滑块以两个数字交互式更新两个独立的功能? 有一个类似问题的链接没有回答here

使用Bokeh Javascript Callback slider power example,我尝试添加第二组变量x和y,但继续使用相同的回调。图表不再更新。 有什么建议?我也试图用Pywidget做同样的事情,但没有得到任何结果。如果有解决方案,我更喜欢使用IPywidget。 最终目标是让仪表板的输入由多个滑块组成,输出由多个绘图组成,所有输出都依赖于同一组滑块输入。

from bokeh.layouts import column
from bokeh.models import CustomJS, ColumnDataSource, Slider
from bokeh.plotting import Figure, output_notebook, show

output_notebook()

x = [x*0.005 for x in range(0, 200)]
y = x
x1 = [x1*0.005 for x1 in range(0, 200)]
y1 = x1

source = ColumnDataSource(data=dict(x=x, y=y))
source1 = ColumnDataSource(data=dict(x1=x1,y1=y1))

plot = Figure(plot_width=400, plot_height=400)
plot.line('x', 'y', source=source, line_width=3, line_alpha=0.6)

plot1 = Figure(plot_width=400, plot_height=400)
plot1.line('x1', 'y1', source=source1, line_width=3, line_alpha=0.6)

callback = CustomJS(args=dict(source=source, source1=source1), code="""
    var data = source.data;
    var data1 = source1.data;
    var f1 =cb_obj.value
    var f = cb_obj.value
    x = data['x']
    y = data['y']
    x1 = data['x1']
    y1 = data['y1']

    for (i = 0; i < x.length; i++) {
        y[i] = Math.pow(x[i], f)
    }
    for (i = 0; i < x1.length; i++) {
        y1[i] = Math.pow(x1[i], f1)
    }
    source.change.emit();
    source1.change.emit();
""")

slider = Slider(start=0.1, end=4, value=1, step=.1, title="power")
slider.js_on_change('value', callback)

layout = column(slider, plot,plot1)

show(layout)

带滑块的两个图形的快照如下所示。滑块未更新任何图表。 Slider and two plots

1 个答案:

答案 0 :(得分:3)

你需要稍微修改一下:

替换

x1 = data['x1']
y1 = data['y1']

x1 = data1['x1']
y1 = data1['y1']

除此之外,你的例子很棒,谢谢!我希望其他人会发现它很有用。