如何在Bokeh / Python / Pywidgets中制作一个滑块/小部件更新多个图？ [英] How to make one slider/widget update multiple plots in Bokeh/Python/Pywidgets?

问题描述

使用Jupyter笔记本，如何让一个滑块以两个数字交互式更新两个独立的功能？
有一个类似问题的链接，无需回答在其他地方。

Using Jupyter notebook, how to have one slider interactively update two independent functions in two figures? There is a link to a similar question without answer here.

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

Using Bokeh Javascript Callback slider power example, I tried adding a second set of variables x and y but keep using the same callback. The graphs do not update anymore. Any suggestions? I also was trying to do the same with Pywidget but did not get anywhere. I would prefer using IPywidget if there is a solution there. The end goal is to have a dashboard with an input composed of multiple slider, and an output composed of multiple plots all dependent on the same set of sliders input.

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没有更新任何图形。
滑块和两个图。

A snapshot of the two graphs with the slider is shown below. Slider is not updating any graph. Slider and two plots.

推荐答案

你需要稍微修改一下：

替换

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

with

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

除此之外，您的示例效果很好，谢谢！我希望其他人会发现它很有用。

Apart from that, your example works great, thank you! I hope other people will find it useful.

这篇关于如何在Bokeh / Python / Pywidgets中制作一个滑块/小部件更新多个图？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！