2017-07-03 56 views
0

我正在使用仪表板,用户在常规散点图上单击许多点之一以获取有关该点的更多信息。每个点代表一组数据,当点击时,用户应该能够看到列出相关数据组的表格。散景图上的可点击的点

该表格将在该图的旁边列出,并且每次选择一个新点(或多个点)时,这些行都会更改。

然后我需要添加过滤器到这张表中,所以它也需要互动。在过滤过程中,绘图不会改变,只有表格中的相关数据。

我看到下面的例子中,这实现了我想达到完全相反:

from bokeh.plotting import Figure, output_file, show 
from bokeh.models import CustomJS 
from bokeh.models.sources import ColumnDataSource 
from bokeh.layouts import column, row 
from bokeh.models.widgets import DataTable, TableColumn, Toggle 

from random import randint 
import pandas as pd 

output_file("data_table_subset_example.html") 

data = dict(
     x=[randint(0, 100) for i in range(10)], 
     y=[randint(0, 100) for i in range(10)], 
     z=['some other data'] * 10 
    ) 
df = pd.DataFrame(data) 
#filtering dataframes with pandas keeps the index numbers consistent 
filtered_df = df[df.x < 80] 

#Creating CDSs from these dataframes gives you a column with indexes 
source1 = ColumnDataSource(df) # FIGURE 
source2 = ColumnDataSource(filtered_df) # TABLE - FILTERED 

fig1 = Figure(plot_width=200, plot_height=200) 
fig1.circle(x='x', y='y', source=source1) 

columns = [ 
     TableColumn(field="x", title="X"), 
     TableColumn(field="z", title="Text"), 
    ] 
data_table = DataTable(source=source2, columns=columns, width=400, height=280) 

button = Toggle(label="Select") 
button.callback = CustomJS(args=dict(source1=source1, source2=source2), code=""" 
     var inds_in_source2 = source2.get('selected')['1d'].indices; 
     var d = source2.get('data'); 
     var inds = [] 

     if (inds_in_source2.length == 0) { return; } 

     for (i = 0; i < inds_in_source2.length; i++) { 
      inds.push(d['index'][i]) 
     } 

     source1.get('selected')['1d'].indices = inds 
     source1.trigger('change'); 
    """) 

show(column(fig1, data_table, button)) 

我试图替换source1中源2按钮回调内,以试图扭转过滤(即选择图上的一个点并过滤数据表)。但数据表根本不被过滤,而是简单地选择与数据点对应的行。任何想法如何筛选其余的行是而不是选择的情节?

+0

答案几乎肯定是,但我认为这个问题对于SO来说太广泛了。例如,你是否想要一个独立的(非服务器)Bokeh文档,或者你是否想要一个Bokeh服务器应用程序(也许你现在还不知道自己!)并不清楚!对于像这样的更开放式的问题,需要来回对话,项目邮件列表是一个更好的资源:https://groups.google.com/a/continuum.io/forum/#!forum/bokeh – bigreddot

+0

@bigreddot我已经包含了一个示例并进行了编辑我的问题。你可以再检查一次吗?如果可能出于某些其他原因,我不希望使用Bokeh服务器,但可以根据需要切换到它。谢谢您的回答! – swenia

回答