Question

我已经建立了一个顶部有一个radiobuttongroup的散点图。如何将小部件与情节链接？我想要实现的结果如下：

选择一个＆＃39; - 仅在x值等于1时显示点

选择两个＆＃39; - 仅在x值等于2时显示点

选择三个＆＃39; - 仅在x值等于3时显示点

到目前为止，这是我的代码：

dataset = {'x':[0,1,2],'y':[0,1,2]}

source2 = ColumnDataSource(data=dataset)


p2 = figure(plot_width=600, plot_height=600, 
            x_range=(-0.1, 2.1), y_range=(-0.1,2.1))

p2.scatter('x', 'y', source=source2, 
          size=15,
          alpha=0.8, 
          line_color=None)

# option
option = RadioButtonGroup(labels=["One", "Two", "Three"], active=0)


show(column(option, p2))

Answer 1

这就是你要找的东西：

from bokeh.io import show
from bokeh.models import ColumnDataSource,
from bokeh.plotting import figure
from bokeh.models.widgets import RadioButtonGroup
from bokeh.layouts import column, widgetbox
from bokeh.models.callbacks import CustomJS

dataset = {'x':[0,1,2],'y':[0,1,2],'x_filter':[0,1,2]}

source = ColumnDataSource(data=dataset)
p = figure(plot_width=600, plot_height=600, 
            x_range=(-0.1, 2.1), y_range=(-0.1,2.1))
p.scatter('x', 'y', source=source, 
          size=15, alpha=0.8, line_color=None)

# add callback to control 
callback = CustomJS(args=dict(p=p, source=source), code="""

            var radio_value = cb_obj.active;
            var data = source.data;            
            x = data['x']
            x_filter = data['x_filter']
            y = data['y']

            for (i = 0; i < x.length; i++) {
                if(x_filter[i] == radio_value) {
                    x[i] = x_filter[i];
                } else {
                    x[i] = undefined;
                }
            }
        source.change.emit();
        """)

# option
option = RadioButtonGroup(labels=["One", "Two", "Three"],
                          active=0, callback=callback)
show(column(widgetbox(option),p))

有趣的代码是JavaScript。基本上，如果点的x坐标等于您的RadioButton选择，它会检查每个点。如果没有，则将该点设置为缺失。这使得该点在图中消失。系统会为您的数据添加新列x_filter。它用于将Radio选项与原始x进行比较。实际的x用于绘图。

Bokeh Python如何与单选按钮进行交互

1 个答案: