使用CustomJS向Bokeh图添加交互式图块

时间:2019-03-01 17:40:24

标签: python-3.x plot callback bokeh interactive

我有一个交互式的散景图,该图使用CheckBoxGroup绘制不同的组合。我希望每次更改组合时都能够修改标题,而不必经历更改代码中的标题并再次生成图的过程。

我对CustomJS非常熟悉,但是我尝试了以下操作(...仅标题摘录):

p = figure(title = 'Default title that appears',
      toolbar_location = 'right')
.
.
update_title = CustomJS(args =dict(source=source, text = text),
                    code ="""
                const data = source.data;
                var text = text.value;

                text = text.value;

                source.change.emit();
""")
text_group = TextInput(title = 'Title', value = "Default value", callback = update_title)
show(column(p,checkbox_group, text_group))

我得到的结果显示了一个标题框,但是更改标题后什么也没发生。

I essentially want to do this:

但是使用CustomJS而不是Python回调。

1 个答案:

答案 0 :(得分:1)

您只需要将标题传递给回调即可。我发现情节标题是Bokeh模型,因此所有常规操作都适用。您的回调可能看起来像这样:

update_title = CustomJS(args=dict(title=plot.title), code="""
    title.text = cb_obj.value
""")

完整示例为

import numpy as np
from bokeh.layouts import row, column
from bokeh.models import CustomJS, TextInput
from bokeh.plotting import figure, output_file, show, ColumnDataSource
x = np.linspace(0, 10, 500)
y = np.sin(x)
source = ColumnDataSource(data=dict(x=x, y=y))
plot = figure(y_range=(-10, 10), plot_width=400, plot_height=400, title='my sine wave')
plot.line('x', 'y', source=source, line_width=3, line_alpha=0.6)
update_title = CustomJS(args=dict(title=plot.title), code="""
    title.text = cb_obj.value
""")
text = TextInput(title='Enter title', value='my sine wave', callback=update_title)
layout = row(
    plot,
    text
)
output_file('title_change.html', title='change title')
show(layout)