Chart.js:如何更改任何尺寸的 x 轴刻度标签对齐方式?

function generateData() {var unit = '天';函数随机数(最小值，最大值){返回 Math.random() * (max - min) + min;}函数随机点(日期，最后关闭){var open = randomNumber(lastClose * 0.95, lastClose * 1.05).toFixed(2);var close = randomNumber(open * 0.95, open * 1.05).toFixed(2);返回 {t: date.valueOf(),y:关闭};}var date = moment().subtract(1, 'years');var now = moment();变量数据 = [];for (; data.length < 600 && date.isBefore(now); date = date.clone().add(1, unit).startOf(unit)) {data.push(randomPoint(date, data.length > 0 ? data[data.length - 1].y : 30));}返回数据；}var TimeCenterScale = Chart.scaleService.getScaleConstructor('time').extend({getPixelForTick:函数(索引){var ticks = this.getTicks();if (index < 0 || index >= ticks.length) {返回空值；}//获取当前刻度的像素值.var px = this.getPixelForOffset(ticks[index].value);//获取下一个刻度的像素值.var nextPx = this.right;var nextTick = ticks[index + 1];如果 (nextTick) {nextPx = this.getPixelForOffset(nextTick.value);}//在当前刻度和下一个刻度的中间对齐标签.返回 px + (nextPx - px)/2;},});//注册刻度类型var defaults = Chart.scaleService.getScaleDefaults('time');Chart.scaleService.registerScaleType('timecenter', TimeCenterScale, defaults);变量 cfg = {数据: {数据集:[{label: 'CHRT - Chart.js Corporation',背景颜色:'红色'，边框颜色:'红色'，数据:生成数据()，类型:'线'，点半径:0，填充:假，线张力:0，边框宽度:2}]},选项: {动画片: {持续时间:0},秤:{x轴:[{类型:'时间中心'，时间: {单位:'月'，步长:1，显示格式:{月份:'MMM'}},网格线: {偏移网格线:真}}],y轴:[{网格线: {画框:假}}]},工具提示:{相交:假，模式:'索引'}}};var chart = new Chart('chart1', cfg);

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></脚本><script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script><canvas id="chart1" height="90"></canvas>

function generateData() {
  var unit = 'day';
  function randomNumber(min, max) {
    return Math.random() * (max - min) + min;
  }

  function randomPoint(date, lastClose) {
    var open = randomNumber(lastClose * 0.95, lastClose * 1.05).toFixed(2);
    var close = randomNumber(open * 0.95, open * 1.05).toFixed(2);
    return {
      t: date.valueOf(),
      y: close
    };
  }
    
  var date = moment().subtract(1, 'years');
  var now = moment();
  var data = [];
  for (; data.length < 600 && date.isBefore(now); date = date.clone().add(1, unit).startOf(unit)) {    
    data.push(randomPoint(date, data.length > 0 ? data[data.length - 1].y : 30));
  }
  return data;
}

var TimeCenterScale = Chart.scaleService.getScaleConstructor('time').extend({
  getPixelForTick: function(index) {
    var ticks = this.getTicks();
    if (index < 0 || index >= ticks.length) {
      return null;
    }
    // Get the pixel value for the current tick.
    var px = this.getPixelForOffset(ticks[index].value);

    // Get the next tick's pixel value.
    var nextPx = this.right;
    var nextTick = ticks[index + 1];
    if (nextTick) {
      nextPx = this.getPixelForOffset(nextTick.value);
    }

    // Align the labels in the middle of the current and next tick.
    return px + (nextPx - px) / 2;
  },
});
// Register the scale type
var defaults = Chart.scaleService.getScaleDefaults('time');
Chart.scaleService.registerScaleType('timecenter', TimeCenterScale, defaults);

var cfg = {
  data: {
    datasets: [{
      label: 'CHRT - Chart.js Corporation',
      backgroundColor: 'red',
      borderColor: 'red',
      data: generateData(),
      type: 'line',
      pointRadius: 0,
      fill: false,
      lineTension: 0,
      borderWidth: 2
    }]
  },
  options: {
    animation: {
      duration: 0
    },
    scales: {
      xAxes: [{
        type: 'timecenter',
        time: {
          unit: 'month',
          stepSize: 1,
          displayFormats: {
            month: 'MMM'
          }
        },
        gridLines: {
          offsetGridLines: true
        }
      }],
      yAxes: [{
        gridLines: {
          drawBorder: false
        }
      }]
    },
    tooltips: {
      intersect: false,
      mode: 'index'
    }
  }
};
var chart = new Chart('chart1', cfg);

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.3/Chart.min.js"></script>
<canvas id="chart1" height="90"></canvas>