Bokeh：Datetime类型X轴无法显示Vbar问题求助

我之前也踩过一模一样的坑！Bokeh里的折线（line）和散点（circle）组件对Datetime类型的X轴支持很友好，但垂直柱状图（vbar）有个容易忽略的细节——它默认需要数值型的X坐标（比如毫秒级时间戳），而不是直接传入Datetime对象。这就是为什么你能看到轴范围变化，却看不到柱子的原因：柱子其实已经画出来了，但因为坐标类型不匹配，被"藏"在了可视区域之外。

核心原因 #

Bokeh的vbar组件的x参数期望接收数值（比如时间戳），而line/circle则可以直接解析Datetime对象。当你直接传入Datetime时，Bokeh会自动尝试转换，但转换后的数值可能和你预期的轴范围不匹配，导致柱子无法在图表中显示。

具体解决方案 #

这里有两种简单有效的解决方法，推荐第一种：

方法1：将Datetime转换为毫秒时间戳

把DataFrame中的Datetime列转换成毫秒级时间戳（Bokeh默认的时间单位），然后用这个数值列作为vbar的x参数，同时保持x轴为datetime类型。

示例代码：

import pandas as pd
from bokeh.plotting import figure, show
from bokeh.models import ColumnDataSource

# 假设你的原始数据结构
df = pd.DataFrame({
    'datetime_col': pd.date_range(start='2024-01-01', periods=5),
    'y_data': [12, 25, 18, 30, 22]
})

# 转换Datetime为毫秒时间戳
df['datetime_ms'] = df['datetime_col'].astype(int) // 10**6  # 转换为毫秒级

# 创建数据源
source = ColumnDataSource(df)

# 创建图表，指定x轴为datetime类型
p = figure(x_axis_type='datetime', width=800, height=400, title='Datetime X轴下的vbar示例')

# 正常显示折线图
p.line(x='datetime_col', y='y_data', source=source, line_width=2, color='blue')

# 显示柱状图，用转换后的时间戳作为x，width设置为对应时间粒度的毫秒数（比如一天=86400*1000）
p.vbar(
    x='datetime_ms',
    top='y_data',
    source=source,
    width=0.8 * 86400 * 1000,  # 设置柱子宽度为0.8天（毫秒数）
    color='orange',
    alpha=0.6
)

show(p)

方法2：使用x_offset配合Datetime

如果你不想转换时间戳，也可以直接用Datetime作为x参数，然后通过x_offset调整柱子的位置，不过这种方法需要手动计算偏移量，不如第一种直观：

# 假设柱子宽度为0.5天
p.vbar(
    x='datetime_col',
    top='y_data',
    source=source,
    width=0.5,  # 这里的width是按时间轴的单位（天）来设置的
    x_offset=-0.25,  # 偏移半个柱子宽度，让柱子居中
    color='orange',
    alpha=0.6
)

关键注意点 #

• vbar的width参数：如果用时间戳作为x，width需要是毫秒数（比如一天=86400*1000）；如果直接用Datetime，width是时间轴的单位（比如天、小时）。
• 可以用DatetimeTickFormatter优化x轴的显示格式，让时间更易读：

  from bokeh.models import DatetimeTickFormatter
  p.xaxis.formatter = DatetimeTickFormatter(
      days=["%Y-%m-%d"],
      months=["%Y-%m"],
      years=["%Y"]
  )
  

这样修改后，你的垂直柱状图应该就能正常显示了，而且轴范围也会正确匹配数据！

内容的提问来源于stack exchange，提问作者user9470055