我一直在寻找，但我找不到解决我的问题的方法。我有一个这样的数据集：{“2023-03-31T00：00：00”：[“B”，“C”]，“2023-03-31T00：20：00”：[]，“2023-03-31T00：40：00”：[]，...}每个时间戳都比前一个时间戳晚20分钟，并且与一个元素数组相关联。我需要用条形图表示数组随时间的大小。
我的问题是：每个数据点实际上表示从时间戳开始到20分钟后结束的时隙上的多个元素，因此，例如，第一个条将总计为2（数组中的两个元素），但必须填充X轴上00：00和00：20刻度之间的空间。

我没有找到任何适合我的解决方案。我尝试的所有方法都是将时间戳作为条形图的中心，但在我的情况下，我希望条形图的左侧与时间戳对齐。
我试过改变标签的对齐方式，设置网格偏移为真或假，在标签上设置10分钟的时间偏移（我时间步长的一半），每次都被证明太复杂或不确定。
有没有一个简单的方法来实现我想要的，这是移动所有的酒吧一半大小的权利，即裁剪左边缘的标签的数据点。
我现在迷路了，所以任何帮助都会非常感激。
下面是我的图的当前配置：

const config = {
  type: 'bar',
  data: data,
  options: {
    responsive: true,
    scales: {
        x: {
            type: 'time',
            time: {
                unit: 'hour',
                displayFormats: {
                    'hour': 'HH:mm'
                },
            },
            min: new Date("2023-03-31T00:00:00Z"),
            max: new Date("2023-04-01T00:00:00Z"),
            grid:
            {
                offset: false,
            },
        },
        y: {
            min: 0,
            ticks:
            {
                stepSize: 1,
            }
        }
    },
    plugins: {
        legend: {
            // Removes the colored rectangle next to the dataset label
            labels: {
                boxWidth: 0,
            },
            // Removes the ability to hide the dataset on click on the label (makes no sense since we only have one
            // dataset)
            onClick: null,
        },

        tooltip: {
            // Removes the colored squared on the tooltip label
            displayColors: false,
            callbacks: {
                // Using our custom tooltip labels
                label: tooltipLabel,
                title: tooltipTitle,
            },
        },
    },
  }
};

干杯，小樱