You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何修复Bokeh楔形饼图中悬停提示框显示多值的问题?

解决Bokeh楔形饼图Hover Tooltip显示多个数值的问题

这个问题的核心原因是你的ColumnDataSource里各字段的长度不一致!

看你的代码:percents有7个元素,所以你生成的x、y、radius数组都是7个值,但category、counts、starts、ends这些对应6个楔形的数据只有6个值。Bokeh会自动循环短数组来匹配长数组的长度,这就导致悬停时单个楔形会重复显示tooltip内容。

修复步骤:

  • 首先统一数据源所有字段的长度:因为你有6个分类,所以x、y、radius应该生成6个值,而不是7个。
  • 可以给HoverTool加上renderers参数,指定只对楔形图形触发悬停,避免不必要的误触发。

修改后的完整代码:

import numpy as np
from bokeh.plotting import figure
from bokeh.io import show, output_file
from bokeh.models import HoverTool, ColumnDataSource
from math import pi

percents = [0, 5/143, 51/143, 88/143, 108/143, 141/143, 1.0]
category = ['A ', 'B ', 'C ', 'D ', 'E ', 'F']
counts = [5, 46, 37, 20, 33, 2]
# 6个楔形对应6组start/end角度
starts = [1/2*pi-(p*2*pi) for p in percents[:-1]]
ends = [1/2*pi-(p*2*pi) for p in percents[1:]]
colors = ['#889dba', '#1f356f', '#1e92b8', '#33748a', '#a5d3e3', '#bbc2d4']

# 修正:x、y、radius生成6个值,和其他数据长度一致
source = ColumnDataSource(
    data=dict(
        x=[0]*len(category),
        y=[0]*len(category),
        radius=[0.5]*len(category),
        category=category,
        starts=starts,
        colors=colors,
        ends=ends,
        counts=counts
    )
)

TOOLS = "hover"
p = figure(plot_width=500, plot_height=500, x_axis_label=None, y_axis_label=None, title='Type', tools=TOOLS)
p.title.align = 'center'
p.title.text_font = 'arial narrow'
# 保存楔形渲染器,方便后续指定hover触发对象
wedge_renderer = p.wedge(x='x', y='y', radius='radius', direction="clock", 
                         start_angle='starts', end_angle='ends', color='colors', source=source)

# 配置HoverTool,指定只对楔形触发
hover = p.select(dict(type=HoverTool))
hover.tooltips = [
    ('Category', '@category'),
    ('Count', '@counts')
]
hover.renderers = [wedge_renderer]  # 关键:只针对楔形图形触发悬停

p.axis.visible = False
p.ygrid.visible = False
p.xgrid.visible = False

output_file('pie.html')
show(p)

关键改动说明:

  1. 把x、y、radius的生成逻辑改成[0]*len(category),确保所有字段都是6个元素,和分类数量完全匹配。
  2. 添加了hover.renderers = [wedge_renderer],让悬停工具只对楔形图形生效,避免画布空白区域误触发。
  3. 调整了tooltip里的文本描述(比如把'percents'改成'Count',因为显示的是counts数值,表述更准确)。

这样修改后,每个楔形悬停时就只会显示对应分类的单个数值了。

内容的提问来源于stack exchange,提问作者gg315

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.15 08:26:55