OffsetGridLines with Time Series

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.0/Chart.min.js"></script>
<canvas id="chart"></canvas>

JavaScript

var ctx = document.getElementById('chart');
var randomDate = function(start, end) {
  return moment(new Date(start.getTime() + Math.random() * (end.getTime() - start.getTime())));
};

var getRandomPoints = function() {
  var randomPoints = [];
  for (var i = 0; i < 50; i++) {
    var fakeDate = randomDate(new Date(2016, 09, 25), new Date(2017, 10, 25))
    randomPoints.push({
      x: fakeDate.toDate(),
      y: Math.round(Math.random() * 100)
    });
  }
  console.log(randomPoints);

  randomPoints.sort(function(a, b) {
    return (a.x - b.x);
  });
  console.log(randomPoints);
  return randomPoints;
}

var startDate = moment().subtract(13, 'month');
var randomData1 = getRandomPoints();
var data = {
  labels: startDate,
  datasets: [{
    fill: "origin",
    label: "Dataset 1",
    lineTension: 0,
    pointRadius: 0,
    type: "line",
    data: randomData1,
    lineTension: 0,
    borderWidth: 2,
    backgroundColor: 'rgba(255, 0, 0, 0.5)',
    borderColor: 'rgba(255,255,255,0.5)'
  }]
};
var options = {
  responsive: true,
  title: {
    display: false
  },
  legend: {
    'position': 'bottom'
  },
  elements: {
    line: {
      fill: '-1'
    }
  },
  scales: {
    xAxes: [{
      type: "time",
      distribution: 'linear',
      bounds: 'data',
      gridLines: {
        offsetGridLines: true
      },
      time: {
        unit: 'month',
        unitStepSize: 1,
        displayFormats: {
          'month': 'MMM'
        }
      },
      display: true,
      scaleLabel: {
        display: false
      },
      ticks: {
        major: {
          fontStyle: "bold",
          fontColor: "#FF0000"
        }
      }
    }],
    yAxes: [{
      stacked: true,
      scaleLabel: {
        display: true,
        labelString: 'value'
      }
    }]
  }
};

var chartSettings = {
  type: 'line',
  data: data,
  options: options
};
new Chart(ctx, chartSettings);