散景： HoverTool() ColumnDataSource 显示 ???使用@时答案

【问题标题】：bokeh: HoverTool() ColumnDataSource shows ??? when using @散景： HoverTool() ColumnDataSource 显示 ???使用@时
【发布时间】：2019-02-24 11:09:00
【问题描述】：

我想向ColumDataSource() 添加工具提示，以捕捉最近的数据点。但是当使用@x, @y 时，它显示？？？而不是最接近的值。不过使用$x, $y 效果很好。

下面是一个例子：

from bokeh.plotting import show, figure, ColumnDataSource
from bokeh.models import HoverTool

a = [x for x in range(10)]
b = [x for x in range(10)]
c = [0.5 * x for x in range(10)]

source = ColumnDataSource(data=dict(a=a, b=b, c=c))

p = figure()
p.line(x='a', y='b', source=source)
p.line(x='a', y='c', source=source)

p.add_tools(HoverTool(
    tooltips=[
        ('index', '$index'),
        ('($x, $y)', "($x, $y)"),
        ('(@x, @y)', "(@x, @y)"),
        ('(@a, @b, @c)', "(@a, @b, @c)")],
    line_policy='nearest',
    mode='mouse'))

show(p)

结果

当我直接传递列表时，它可以正常工作……

在有两个图表的图中，我只想显示当前悬停图表的最接近的值。因此使用@b, @c 不是我想要的。

更新：

该图有两个图表，我只想显示悬停的图表的 y 轴的值。

我想要的结果是：

但在这种情况下，我直接传递列表对象：

p.line(a, b)
p.line(a, c)

p.add_tools(HoverTool(
    tooltips=[
        ('index', '$index'),
        ('(@x, @y)', "(@x, @y)")],
    line_policy='nearest',
    mode='vline'))

使用ColumnDataSource()时，我必须使用变量的名称，并且不能使用@y引用y轴。

因此我得到以下结果：

p.line(x='a', y='b', source=source)
p.line(x='a', y='c', source=source)

p.add_tools(HoverTool(
    tooltips=[
        ('index', '$index'),
        ('(@x, @y)', "(@x, @y)"),
        ('@a', '@a'),
        ('@b', '@b'),
        ('@c', '@c')],
    line_policy='nearest',
    mode='vline'))

HoverTool 不只显示悬停图形的 y 轴值。它显示了两者的值 (@b and @c)。

【问题讨论】：

标签： python bokeh

【解决方案1】：

我通过将HoverTool() 分配给个人renderers 解决了这个问题。

rb = p.line(x='a', y='b', source=source)
rc = p.line(x='a', y='c', source=source)

p.add_tools(HoverTool(
    renderers=[rb],
    tooltips=[
        ('index', '$index'),
        ('(@a, @b)', "(@a, @b)")],
    line_policy='nearest',
    mode='mouse'))

p.add_tools(HoverTool(
    renderers=[rc],
    tooltips=[
        ('index', '$index'),
        ('(@a, @c)', "(@a, @c)")],
    line_policy='nearest',
    mode='mouse'))

【讨论】：

【解决方案2】：

您必须在 ColumnDataSource 中设置要显示的值。我不太了解您要显示的内容，但我将粘贴您可以在页面中找到的 Bokeh 中的示例代码。基本上，“x”和“y”是要绘制的变量，接下来是要显示的变量。

# Make the ColumnDataSource: source
source = ColumnDataSource(data={
    'x'       : data.loc[1970].fertility,
    'y'       : data.loc[1970].life,
    'country' : data.loc[1970].Country,
})

# Create the figure: p
p = figure(title='1970', x_axis_label='Fertility (children per woman)', 
y_axis_label='Life Expectancy (years)',plot_height=400, plot_width=700,
tools=[HoverTool(tooltips='@country')])

# Add a circle glyph to the figure p
p.circle(x='x', y='y', source=source)

# Output the file and show the figure
output_file('gapminder.html')
show(p)

【讨论】：

我已经更新了我的帖子以更详细地解释这个问题。