angular - 时间类型柱状图中两个 x 轴值之间的柱位置

我想在 x 轴每对数值之间垂直对齐我的图表的条形。

我当前版本的条形图是： https://image.noelshack.com/fichiers/2019/29/3/1563363518-barchartscreenshot.png

我想做的是：https://image.noelshack.com/fichiers/2019/29/3/1563363518-centeredbarsobjective.png

这是用于一个 Angular 7 应用程序，其依赖项如下以使用 chart.js ："chart.js": "^2.8.0"，"chartjs-plugin-datalabels": "^0.6.0"，"ng2-charts": "^2.2.0"

这是我的条形图的配置：

  public barChartOptions: ChartOptions = {
    responsive: true,
    scales: {
      xAxes: [
        {
          barPercentage: 0.9,
          categoryPercentage: 1.0,
          stacked: true,
          type: 'time',
          time: {
            parser: 'HH',
            unit: 'hour',
            unitStepSize: 1,
            displayFormats: {
                hour: 'HH',
            }
          }
        },
      ],
      yAxes: [{
          stacked: true
        }
      ]
    },
    legend: { 
      position: 'bottom' 
    },
    title: {
      display: true,
      text: 'Data distribution',
      position: 'top'
    },
    plugins: {
      datalabels: {
        display: true,
        align: 'center',
        anchor: 'center'
      }
    }
  };
  public barChartLabels: Label[] = ['12','13','14','15'];
  public barChartType: ChartType = 'bar';
  public barChartLegend = true;
  public barChartPlugins = [pluginDataLabels];
  public barChartData: ChartDataSets[] = [{
    data: [40, 80, 60], 
    label: 'Series A' 
  },
  {
    data: [10, 30, 50], 
    label: 'Series B'

  }];

问题的 Stackblitz

谢谢你的帮助 :)

卢卡斯