javascript - Bokeh:如何从回调中打开/关闭 HoverTool？

Question

有没有办法在回调中激活/停用悬停工具？

我尝试在使用复选框切换线可见性的同时执行此操作。每行都有一个hovertool，当一行有“visible=false”时，我将相应工具的“names”属性设置为一个虚拟字符串；否则我将它设置为等于该行的初始“名称”属性。

它在第一次选中任何框时起作用，其他两行消失并且 hovertool 不显示在它们上面。但是重新激活悬停工具不起作用。

这是我的尝试:

from bokeh.plotting import figure, output_file
from bokeh.models import CustomJS, HoverTool, CheckboxGroup, ColumnDataSource
from bokeh.layouts import gridplot
from bokeh.resources import CDN
from bokeh.embed import file_html

from collections import OrderedDict

TOOLTIPS = [ ("x", "$~x"), ("y", "$~y") ]

TOOLS = ['crosshair']

source = ColumnDataSource(data={'x':range(10),'y0':range(10),'y1':range(10)[::-1],'y2':[i**0.5 for i in range(10)]})

fig = figure(tools=TOOLS)

fig.tools[0].dimensions = 'height'

plots = []
plots.append( fig.line(x='x',y='y0', name="0", source=source) )
plots.append( fig.line(x='x',y='y1', name="1", source=source) )
plots.append( fig.line(x='x',y='y2', name="2", source=source) )


names = ['first','second','third']
ID=0
for plot in plots:
    fig.add_tools( HoverTool(mode='vline',line_policy='interp',renderers=[plot],names=[str(ID)],tooltips=OrderedDict( [('name',names[ID])]+TOOLTIPS )) )
    ID+=1

N_plots = range(len(plots))

checkbox = CheckboxGroup(labels=names,active=[],width=200)
checkbox_iterable =[('p'+str(i),plots[i]) for i in N_plots]+[('hover'+str(i),fig.tools[1:][i]) for i in N_plots]+[('checkbox',checkbox)]
checkbox_code = """var indexOf = [].indexOf;"""+''.join(['p'+str(i)+'.visible = indexOf.call(checkbox.active, '+str(i)+') >= 0;' for i in N_plots])
checkbox_code += ''.join(['if(p'+str(i)+'.visible) hover'+str(i)+'.names = ["'+str(i)+'"];' for i in N_plots])+''.join(['if(p'+str(i)+'.visible==false) hover'+str(i)+'.names = ["no"];' for i in N_plots])
checkbox_code += ''.join(['console.log(hover'+str(i)+'.names);' for i in N_plots])
checkbox.callback = CustomJS(args={key: value for key,value in checkbox_iterable}, code=checkbox_code)

grid = gridplot([[fig,checkbox]],toolbar_location='left')

outfile=open('hovtest.html','w')
outfile.write(file_html(grid,CDN,'test'))
outfile.close()

我使用 Bokeh 0.12.4

Answer 1

bokeh 讨论组中的某个人找到了一个很好的方法来执行此操作 (bokeh discussion thread)。

我们可以根据 checkbox.active 列表更改悬停工具的显示属性。这是一个示例代码:

from bokeh.plotting import figure, output_file
from bokeh.models import CustomJS, HoverTool, CheckboxGroup, ColumnDataSource
from bokeh.layouts import gridplot
from bokeh.resources import CDN
from bokeh.embed import file_html

from collections import OrderedDict

TOOLTIPS = [ ("x", "$~x"), ("y", "$~y") ]

TOOLS = ['crosshair']

data = {'x':range(10),
        'y0':range(10),
        'y1':range(10)[::-1],
        'y2':[i**0.5 for i in range(10)]
        }

source = ColumnDataSource(data=data)

fig = figure(tools=TOOLS)

fig.tools[0].dimensions = 'height'

plots = []
plots.append( fig.line(x='x',y='y0', name="first", source=source) )
plots.append( fig.line(x='x',y='y1', name="second", source=source) )
plots.append( fig.line(x='x',y='y2', name="third", source=source) )

checkbox = CheckboxGroup(   
    labels=[plot.name for plot in plots],
    active=[0,1,2],
    width=200,
    callback = CustomJS(    args=dict(p0=plots[0],p1=plots[1],p2=plots[2]),
                            code = """
                                p0.visible = cb_obj.active.includes(0);
                                p1.visible = cb_obj.active.includes(1);
                                p2.visible = cb_obj.active.includes(2);
                                """
                        )
    )

for ID,plot in enumerate(plots):
    fig.add_tools(  
        HoverTool(  
            mode='vline',
            line_policy='interp',
            renderers=[plot],
            names=[plot.name],
            tooltips=OrderedDict( [('name',plot.name)]+TOOLTIPS ),
            callback=CustomJS(  args=dict(cb=checkbox),
                                code="""
                                    if(!cb.active.includes(%d)) {
                                    document.getElementsByClassName('bk-tooltip')[%d].style.display = 'none';
                                    }
                                    """ % (ID,ID)
                                )
            ) 
    )

grid = gridplot([[fig,checkbox]],toolbar_location='left')

outfile=open('hovtest.html','w')
outfile.write(file_html(grid,CDN,'hovtest'))
outfile.close()