Bokeh:使用CustomJS从checkboxgroup组更新散点图以过滤源

from bokeh.io import output_file, show
from bokeh.layouts import column
from bokeh.models import CheckboxGroup, ColumnDataSource
from bokeh.plotting import figure

# 准备数据
data = {'x': [1, 2, 3, 4, 5], 'y': [6, 7, 2, 4, 5], 'labels': ['A', 'B', 'C', 'D', 'E']}
source = ColumnDataSource(data)

# 创建散点图
p = figure(plot_width=400, plot_height=400)
scatter = p.circle('x', 'y', source=source, size=20)

# 创建 CheckboxGroup
checkbox_group = CheckboxGroup(labels=data['labels'], active=[0, 1, 2])

# 定义 CustomJS 回调
callback = CustomJS(args=dict(source=source, checkbox_group=checkbox_group), code="""
    const data = source.data;
    const active = checkbox_group.active;
    const labels = checkbox_group.labels;
    const x = data['x'];
    const y = data['y'];
    
    for (let i = 0; i < labels.length; i++) {
        x[i] = active.includes(i) ? data['x'][i] : null;
        y[i] = active.includes(i) ? data['y'][i] : null;
    }
    
    source.change.emit();
""")

# 将回调绑定到 CheckboxGroup
checkbox_group.js_on_change('active', callback)

# 布局并显示
layout = column(checkbox_group, p)
output_file("filter.html")
show(layout)