【问题标题】:Bokeh: Synchronizing hover tooltips in linked plots散景:在链接图中同步悬停工具提示
【发布时间】:2016-03-14 08:50:22
【问题描述】:

我有两个链接的情节。悬停时,我希望在两个图中都出现一个工具提示。我已经非常成功地使用了链接选择,但现在我还想链接工具提示。

下面是一个例子。工具提示出现在左图中。如果我可以在正确的图中显示相应的工具提示,那就太好了。对应的数据点就是ID相同的数据点。 (有一个共享的 3D 列数据源;每个绘图采用不同的 2D 视图)。

附言。我会改进工具提示中的文字。

更新

最后是这样的:

【问题讨论】:

    标签: python bokeh


    【解决方案1】:

    有点晚了,但如果有人想知道,这是我的解决方案:

    from bokeh.io import curdoc
    from bokeh.layouts import row
    from bokeh.plotting import figure
    from bokeh.models import ColumnDataSource, HoverTool, CustomJS
    
    x = list(range(-20, 21))
    y0 = [abs(xx) for xx in x]
    y1 = [xx**2 for xx in x]
    
    # can be either the same source for all plots or different sources (as shown here) but the length of the sources should be the same
    source1 = ColumnDataSource(data=dict(x=x, y0=y0, y1=y1))
    source2 = ColumnDataSource(data=dict(x=x, y0=y0, y1=y1))
    code1 = "source1.set('selected', cb_data['index']);"
    code2 = "source2.set('selected', cb_data['index']);"
    callback = CustomJS(args={'source1': source1, 'source2': source2}, code=code1+code2)
    
    p1 = figure(tools=[], width=300, height=300, title=None, toolbar_location=None)
    p2 = figure(tools=[], width=300, height=300, title=None, toolbar_location=None)
    c1 = p1.circle(x='x', y='y0', source=source1)
    c2 = p2.circle(x='x', y='y1', source=source2)
    hover1 = HoverTool(callback=callback, renderers=[c1])
    hover2 = HoverTool(callback=callback, renderers=[c2])
    p1.add_tools(hover1)
    p2.add_tools(hover2)
    
    doc_layout = row([p1, p2])
    curdoc().add_root(doc_layout)
    

    【讨论】:

    • 我知道这个答案已经有一段时间了。但是对于 Bokeh 2.3.0,这似乎不起作用。出现错误Uncaught TypeError: source1.set is not a function。是否有可能在新版本中有链接的悬停工具?
    【解决方案2】:

    我不确定如何直接使用工具提示功能来执行此操作,但这里有一种使用文本字形来模仿工具提示的方法:

    from bokeh.io import gridplot
    from bokeh.plotting import figure, output_file, show
    from bokeh.models import ColumnDataSource, Circle, HoverTool, CustomJS, Text
    import numpy as np
    (x, y, z) = np.arange(0, 100, 10), 100-np.arange(0, 100, 10), np.arange(0, 100, 10)/5
    
    output_file("hover_callback.html")
    
    p = figure(width=300, height=300, title='Hover over points', x_axis_label='x', y_axis_label='y')
    p.scatter(x, y)
    p2 = figure(width=300, height=300, title='Hover over points', x_axis_label='x', y_axis_label='z', x_range=p.x_range)
    p2.scatter(x, z)
    
    source = ColumnDataSource({'x': x, 'y': y, 'z': z, 'txt': ['x='+str(x[i])+', y='+str(y[i]) for i in range(len(x))], 'txt2': ['x='+str(x[i])+', z='+str(z[i]) for i in range(len(x))]})
    
    invisible_circle = Circle(x='x', y='y', fill_color='gray', fill_alpha=0.0, line_color=None, size=20) # size determines how big the hover area will be
    invisible_circle2 = Circle(x='x', y='z', fill_color='gray', fill_alpha=0.0, line_color=None, size=20)
    
    invisible_text = Text(x='x', y='y', text='txt', text_color='black', text_alpha=0.0)
    visible_text = Text(x='x', y='y', text='txt', text_color='black', text_alpha=0.5)
    
    invisible_text2 = Text(x='x', y='z', text='txt2', text_color='black', text_alpha=0.0)
    visible_text2 = Text(x='x', y='z', text='txt2', text_color='black', text_alpha=0.5)
    
    cr = p.add_glyph(source, invisible_circle, selection_glyph=invisible_circle, nonselection_glyph=invisible_circle)
    crt = p.add_glyph(source, invisible_text, selection_glyph=visible_text, nonselection_glyph=invisible_text)
    cr2 = p2.add_glyph(source, invisible_circle2, selection_glyph=invisible_circle2, nonselection_glyph=invisible_circle2)
    cr2t = p2.add_glyph(source, invisible_text2, selection_glyph=visible_text2, nonselection_glyph=invisible_text2)
    
    code = "source.set('selected', cb_data['index']);"
    callback = CustomJS(args={'source': source}, code=code)
    p.add_tools(HoverTool(tooltips=None, callback=callback, renderers=[cr, crt]))
    p2.add_tools(HoverTool(tooltips=None, callback=callback, renderers=[cr2, cr2t]))
    layout = gridplot([[p, p2]])
    show(layout)
    

    输出如下所示:

    【讨论】:

    • 谢谢。这和我想出的很接近。
    • 酷!我想知道在后期的散景迭代中是否可能包含同步工具提示的功能——它似乎处于相当重要的开发阶段。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-05-07
    • 1970-01-01
    • 2021-12-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-10-08
    相关资源
    最近更新 更多