使用Boost中的AutocompleteInput值觸發「tap」

Question

我使用來自熊貓數據框（df）的Bokeh製作了一些數據的散點圖。數據框是大學數據，並具有「faculty_salary」，「tuition」，「sector」和「institution_name」列。情節是faculty_salary與學費，我正在使用該部門着色數據，如下所示。

我現在有自來水的工具，除了您點擊了其中一個灰色，其他所有的數據點，如下圖所示。

我想要做的就是使用AutocompleteInput小窗口以選擇從自動完成的INSTITUTION_NAME並經變灰所有其它的，就像水龍頭工具強調數據點。 AutocompleteInput小部件工作正常，它只是使代碼突出顯示我正在努力弄清楚的數據點。下面是我在哪裏：

source = ColumnDataSource(df) 
autocomp = AutocompleteInput(completions=df['name'].tolist()) 
callback = CustomJS(args=dict(source=source), code=""" 
    what do I put here?? It doesn't seem to have a cb_obj 
""") 
autocomp.js_on_change('value',callback) 

請讓我知道我可以實現我所描述的功能：使用選定的值在AutocompleteInput突出它對應的數據點。我應該注意到，對於我的應用程序，我更喜歡CustomJS解決方案，而不是Bokeh服務器解決方案。

編輯：事實證明，我的瀏覽器（Linux中的Chrome）無法識別已選擇了自動補全值，但Firefox for Linux確實如此。我認爲這一定是因爲jquery UI說：

這個小部件以編程方式操縱它的元素的值，因此當元素的值改變時可能不會觸發本地的change事件。

如何在Bokeh中解決此問題的建議值得歡迎。

Answer 1

這裏的背景虛化的服務器解決方案：

from bokeh.layouts import layout 
from bokeh.io import curdoc 
from bokeh.models.widgets import AutocompleteInput 
from bokeh.models.widgets import (Panel, Tabs, DataTable, TableColumn, 
            Paragraph, Slider, Div, Button, Select) 
from bokeh.plotting import figure, ColumnDataSource 
from bokeh.models import HoverTool,TapTool 

def update_selected(wttr,old,new): 
    a_val = autocomp.value 
    names = source.data['names'] 
    ind = [i for i,x in enumerate(names) if x == a_val] 
    source.selected={'0d': {'glyph': None, 'indices': []}, '1d': {'indices': ind}, '2d': {}} 


data_dict = {'names':['test2','test3','hello','goodbye'], 
      'x':[0,1,2,3], 'y':[10,20,30,40]} 
source = ColumnDataSource(data_dict) 
autocomp = AutocompleteInput(completions=['test2','test3','hello','goodbye']) 
autocomp.on_change('value',update_selected) 
fig = figure(plot_width=400, 
      plot_height=400, 
      x_axis_label='x', 
      y_axis_label='y', 
      tools=["pan","hover","box_zoom","reset,save"]) 

fig.scatter('x','y',source=source) 
layout = layout([[fig, autocomp]]) 
curdoc().add_root(layout) 

編輯：這是使用customJS

from bokeh.layouts import layout 
from bokeh.io import curdoc 
from bokeh.models.widgets import AutocompleteInput 
from bokeh.plotting import figure, ColumnDataSource 
from bokeh.models.callbacks import CustomJS 

data_dict = {'names':['test2','test3','hello','test3'], 
      'x':[0,1,2,3], 'y':[10,20,30,40]} 
source = ColumnDataSource(data_dict) 
fig = figure(plot_width=400, 
      plot_height=400, 
      x_axis_label='x', 
      y_axis_label='y', 
      tools=["pan","hover","box_zoom","reset,save"]) 

fig.scatter('x','y',source=source) 
autocomp = AutocompleteInput(completions=['test2','test3','hello','goodbye']) 
code = """ 
var autocomplete = cb_obj.value 
var names = source.data.names 
function getAllIndexes(arr, val) { 
    var indexes = [], i; 
    for(i = 0; i < arr.length; i++) 
     if (arr[i] === val) 
      indexes.push(i); 
    return indexes; 
} 
var index = getAllIndexes(names,autocomplete) 
source.selected = {'0d':{indices: [0]}, '1d':{indices: index},'2d':{indices: [0]}} 
""" 

callback = CustomJS(args={'source':source}, code=code) 
autocomp.callback = callback 
layout = layout([[fig, autocomp]]) 
curdoc().add_root(layout)