我有两个具有相同关键字的数据源。源1具有要绘制的具有唯一关键字的关键字/值对。源2具有与源1相同的关键字,但每个关键字都可能具有多个值。
点击图(源1)上的一个点是否可以打开一个新的数据表,显示源2中的所有对应行?即,如果在图上选择了3个不同的点,则将显示3个不同的数据表。
我希望能在两个方面得到帮助:
1.仅显示数据表中一个键的值。
1.每次在图上选择一个点时都显示一个新的数据表,取消选择时则消失。
我想出了如何将图链接到具有不同源&相同键的数据表,并在单击图上的一个点时突出显示相应的行。
import numpy as np
import pandas as pd
from bokeh.models.callbacks import CustomJS
from bokeh.plotting import figure
from bokeh.io import show
from bokeh.layouts import row
from bokeh.models.widgets import DataTable, TableColumn
from bokeh.models import ColumnDataSource, CustomJSFilter, TapTool, HoverTool
source = ColumnDataSource(pd.DataFrame(
np.array([[i, i] for i in range(0, 10)]), columns=['x', 'y']))
data = [[i, "%s.%d" % ("data", i)] for i in range(0, 10)]
data.extend([[i, "%s.%d" % ("data", i)] for i in range(0, 10)])
source2 = ColumnDataSource(pd.DataFrame(data, columns = ['x', 'data']))
columns = [
TableColumn(field='x', title='x'),
TableColumn(field='data', title='data'),
]
data_table = DataTable(source=source2, columns=columns, width=600, height=400)
selection_callback = CustomJS(args=dict(source=source, source2=source2, p2=data_table), code="""
var indices = []
var source_x = source.data.x[source.selected.indices[0]]
source2.data.x.forEach((source2_x, i) => {
if (source2_x == source_x) {
indices.push(i)
}
});
source2.selected.indices = indices
p2.change.emit()
""")
plot = figure(title="Plot1", tools="tap,pan,box_zoom,wheel_zoom,save,reset")
plot.select(TapTool).callback = selection_callback
source.selected.js_on_change('indices', selection_callback)
plot.circle('x', 'y', source=source, line_color=None, color='red', size=6)
show(row(plot, data_table))
我试着用“source2.indices”替换“source2.selected.indices”来隐藏未选中的索引,但似乎没有任何作用。
我还没有找到任何关于使图或表格随着交互而出现/消失的信息。
1条答案
按热度按时间0lvr5msh1#
再玩了一会儿这个,我就弄明白了。
具体而言:
为数据表创建了一个主ColumnDataSource。将数据表中的数据设置为相关子集。将数据表的可见性设置为false以隐藏它,除非选择了特定的值。以下是相关的CustomJS代码片段: