如何在Ruby on Rails中让柱状图X轴精确显示一周7天？

要让X轴强制显示过去7天的所有日期，哪怕当天没有完成任务，你需要先构建完整的日期范围并补全缺失天数的计数为0，而不是直接用数据库分组的结果（因为分组只会返回有数据的日期）。

步骤1：在控制器中预处理数据 #

修改控制器里的代码，生成包含过去7天所有日期的计数哈希：

@completed_tasks = Task.where(user_id: current_user.id, completed: true)

# 1. 查询数据库中过去7天的完成任务数，按日期分组
db_counts = @completed_tasks.where(completed_time: 1.week.ago..Time.current)
                           .group_by_day(:completed_time, format: "%Y-%m-%d")
                           .count

# 2. 生成过去7天的完整日期范围（从6天前到今天，共7天）
date_range = (Date.today - 6.days)..Date.today

# 3. 初始化所有日期的计数为0
daily_counts = date_range.each_with_object({}) do |date, hash|
  hash[date.strftime("%Y-%m-%d")] = 0
end

# 4. 合并数据库查询到的真实计数，覆盖对应日期的初始值
daily_counts.merge!(db_counts.transform_keys { |date_key| date_key.strftime("%Y-%m-%d") })

步骤2：在视图中绘制柱状图 #

用预处理好的daily_counts渲染图表，并指定X轴分类为完整的日期列表：

<%= column_chart daily_counts, 
                 xaxis: { categories: daily_counts.keys },
                 title: "过去7天完成任务数" %>

关键说明 #

• group_by_day的format参数确保数据库返回的日期格式和我们生成的日期格式一致，避免合并时匹配失败。
• 通过date_range生成完整7天的日期数组，初始化计数为0，再合并真实数据，保证每个日期都有对应的值，Chartkick就会在X轴显示全部7天。
• 时间范围用1.week.ago..Time.current确保包含当天的任务数据。

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