我是Bokeh的新手,我正在尝试构建一个可以根据小部件提供的输入动态更新的绘图。但是,对于大多数小部件,Python回调的用法尚未完全记录下来,因此我陷入了困境。
on_event
或on_change
),我仍然必须弄清楚其签名和参数。例如,如果我使用on_change
,我可以监视哪些小部件属性?这是一个适当的示例。我正在使用this example中的笔记本嵌入式服务器。作为练习,我想用带有任意值的DataTable
替换滑块。这是我当前拥有的代码:
from bokeh.layouts import column
from bokeh.models import ColumnDataSource, DataTable
from bokeh.plotting import figure
from bokeh.io import show, output_notebook
from bokeh.sampledata.sea_surface_temperature import sea_surface_temperature
output_notebook()
def modify_doc(doc):
df = sea_surface_temperature.copy()
source = ColumnDataSource(data=df)
source_table = ColumnDataSource(data={"alpha": [s for s in "abcdefgh"],
"num": list(range(8))})
plot = figure(x_axis_type='datetime', y_range=(0, 25),
y_axis_label='Temperature (Celsius)',
title="Sea Surface Temperature at 43.18, -70.43")
plot.line('time', 'temperature', source=source)
def callback(attr, old, new):
# This is the old callback from the example. What is "new" when I use
# a table widget?
if new == 0:
data = df
else:
data = df.rolling('{0}D'.format(new)).mean()
source.data = ColumnDataSource(data=data).data
table = DataTable(source=source_table,
columns=[TableColumn(field="alpha", title="Alpha"),
TableColumn(field="num", title="Num")])
# How can I attach a callback to table so that the plot gets updated
# with the "num" value when I select a row?
# table.on_change("some_attribute", callback)
doc.add_root(column(table, plot))
show(modify_doc)
答案 0 :(得分:2)
JavaScript callbacks和Python callbacks是Bokeh中非常强大的工具,可以附加到任何Bokeh模型元素。另外,您可以通过编写自己的extensions with TypeScript(最终编译为JS)来扩展Bokeh功能
可以使用以下两种方法之一添加JS回调:
Model.js_on_event('event', callback)
Model.js_on_change('attr', callback)
Python回调主要用于小部件:
Widget.on_event('event, event_handler)
Widget.on_change('attr', onchange_handler)
Widget.on_click(onclick_handler)
每个小部件的事件处理程序的确切函数签名可以是:
event_handler(event)
onchange_handler(attr, old, new)
onclick_handler(new)
onclick_handler()
attr
可以是任何窗口小部件类(或它的基类)属性。因此,您始终需要咨询Bokeh reference pages。扩展JSON原型也有助于找出支持的属性,例如在查看Div时,我们无法直接看到来自其基类的id
,name
,style
或text
属性。但是,所有这些属性都存在于Div的JSON原型中,因此受Div支持:
{
"css_classes": [],
"disabled": false,
"height": null,
"id": "32025",
"js_event_callbacks": {},
"js_property_callbacks": {},
"name": null,
"render_as_text": false,
"sizing_mode": "fixed",
"style": {},
"subscribed_events": [],
"tags": [],
"text": "",
"width": null
}
回到您的问题:很多时候,您可以使用不同的方法获得相同的结果。
据我所知,没有一种很好的方法可以列出每个小部件的所有受支持的事件,但是阅读文档并深入研究基类会有很大帮助。
使用上述方法,可以检查您可以在回调中使用哪些小部件属性。当涉及到事件时,建议您在IDE中查看并探索bokeh.events
类。您可以在其中找到每个事件的扩展说明。随着程序员的直觉来选择窗口小部件支持的正确事件,时间会自然而然地发生(因此,button_click
没有Plot
,pan
没有Button
事件,但是反之)。
决定是将哪个小部件(模型元素)附加到回调以及选择哪种方法或将回调绑定到哪个事件的决定主要取决于:哪个用户操作应触发您的回调? >
因此,您可以将JS回调附加到任何小部件(值更改,滑块移动等),任何工具(TapTool,HoverTool等),data_source(单击字形),绘制画布(例如点击字形以外的区域)或绘图范围(缩放或平移事件),等等...
基本上,您需要了解所有Python对象在BokehJS中都有它们的等效项,因此您可以在两个域中以相同的方式使用它们(当然,在语法上有所不同)。
例如, This documentation显示ColumnDataSource具有“ selected”属性,因此对于点,您可以检查source.selected.indices
并查看在情节上选择了哪个点或在您的情况下类似:选择了哪些表行。您可以在Python和浏览器中的代码中设置断点,并检查Python或BokehJS数据结构。
这是您的代码(由于我没有安装Jupiter Notebook,因此对“ pure Bokeh” v1.0.4做了一些修改)
from bokeh.layouts import column
from bokeh.models import ColumnDataSource, DataTable, TableColumn
from bokeh.plotting import figure, curdoc
from bokeh.io import show, output_notebook
from bokeh.sampledata.sea_surface_temperature import sea_surface_temperature
# output_notebook()
def modify_doc(doc):
df = sea_surface_temperature.copy()
source = ColumnDataSource(data = df)
source_table = ColumnDataSource(data = {"alpha": [s for s in "abcdefgh"],
"num": list(range(8))})
plot = figure(x_axis_type = 'datetime', y_range = (0, 25),
y_axis_label = 'Temperature (Celsius)',
title = "Sea Surface Temperature at 43.18, -70.43")
plot.line('time', 'temperature', source = source)
def callback(attr, old, new): # here new is an array containing selected rows
if new == 0:
data = df
else:
data = df.rolling('{0}D'.format(new[0])).mean() # asuming one row is selected
source.data = ColumnDataSource(data = data).data
table = DataTable(source = source_table,
columns = [TableColumn(field = "alpha", title = "Alpha"),
TableColumn(field = "num", title = "Num")])
source_table.selected.on_change('indices', callback)
doc().add_root(column(table, plot))
modify_doc(curdoc)
# show(modify_doc)
结果: