数据框的交互式图：下拉菜单选择要显示的列（散景）

Question

我第一次尝试使用Bokeh库，但我发现文档并不那么简单。

我有一个数据帧df：

A   B   C
1   4   6
2   3   5
3   2   4
4   1   3

我想用Boken创建一个直方图，其中集成了一个小部件，以便用户选择要显示的列（A B或C）。

我写了以下内容：

import pandas as pd

d= {'A': [1, 2,3,4], 'cB': [4,3,2,1], 'C' : [6,5,4,3]}

df = pd.DataFrame(data=d)

names = ["A","B", "C"]

from bokeh.io import output_file, show
from bokeh.layouts import widgetbox
from bokeh.models.widgets import MultiSelect
from bokeh.io import curdoc

# drop table
curdoc().clear() 
# create drop down  #define witget

output_file("multi_select.html")
Field =  MultiSelect(title="Features:", value=["A"],
                           options=names)
show(widgetbox(Field))



from bokeh.charts import Histogram, output_file, show
from bokeh.layouts import row, layout
from bokeh.models.sources import ColumnDataSource
curdoc().clear()
source = ColumnDataSource(df)

hist = Histogram(df, values="A", title="A", plot_width=400) #not sure why I cannot use source instead of df

output_file('hist.html')
show(hist)

所以现在我需要将绘图与小部件连接起来。

我尝试了以下但它似乎不起作用。

hist = Histogram(df, values={'Field'}, title={'Field'}, plot_width=400)

欢迎任何其他不使用散景库的解决方案，我使用Spyder编辑器运行代码，并使用IE来显示结果。

Answer 1

使用此代码，您将能够与列进行交互。我正在使用最新版本的Pandas，Numpy和Bokeh。在新的更新中，不推荐使用Bokeh.charts。

import pandas as pd
import numpy as np

#Pandas version 0.22.0
#Bokeh version 0.12.10
#Numpy version 1.12.1

from bokeh.io import output_file, show,curdoc
from bokeh.models import Quad
from bokeh.layouts import row, layout,widgetbox
from bokeh.models.widgets import Select,MultiSelect
from bokeh.plotting import ColumnDataSource,Figure,reset_output,gridplot

d= {'A': [1,1,1,2,2,3,4,4,4,4,4], 'B': [1,2,2,2,3,3,4,5,6,6,6], 'C' : [2,2,2,2,2,3,4,5,6,6,6]}
df = pd.DataFrame(data=d)
names = ["A","B", "C"]

#Since bokeh.charts are deprecated so using the new method using numpy histogram
hist,edge = np.histogram(df['A'],bins=4)
#This is the method you need to pass the histogram objects to source data here it takes edge values for each bin start and end and hist gives count.
source = ColumnDataSource(data={'hist': hist, 'edges_rt': edge[1:], 'edges_lt':edge[:-1]})

plot = Figure(plot_height = 300,plot_width = 400)
#The quad is used to display the histogram using bokeh.
plot.quad(top='hist', bottom=0, left='edges_lt', right='edges_rt',fill_color="#036564", 
          line_color="#033649",source = source)

#When you change the selection it will this function and changes the source data so that values are updated.
def callback_menu(attr, old, new):

    hist,edge = np.histogram(df[menu.value],bins=4)
    source.data={'hist': hist,'edges_rt': edge[1:], 'edges_lt': edge[:-1]}

#These are interacting tools in the final graph
menu = MultiSelect(options=names,value= ['A','B'], title='Sensor Data')
menu.on_change('value', callback_menu)
layout = gridplot([[widgetbox(menu),plot]])
curdoc().add_root(layout)

保存文件后，请在同一目录的Anaconda提示符中使用以下命令启动散景服务器，以便您可以与图表进行交互。

bokeh serve --show Python_Program_Name.py

运行图表并选择如下所示

Answer 2

所以我仍然没有设法使用带回调函数和数据帧的散景。但是，在使用Jupiter时，我找到了一个非常简单的替代方案，

import matplotlib.pyplot as pl
hue = ["A", "B"]
@interact (col= ["A", "B", "C"])
def plot(col):
    pl.figure()
    pl.hist( df[col]) 
    pl.show()

plot(col)