Chartjs-White space at start and end of data with time scale in chart.js

There is a workaround by adding a null value to your first and last x value

fiddle here

var chartTestData = {
  labels: [
  '2017-08-16 23:00:00',
  '2017-08-17 00:00:00', '2017-08-17 01:00:00', '2017-08-17 02:00:00', '2017-08-17 03:00:00', '2017-08-17 04:00:00', '2017-08-17 05:00:00', '2017-08-17 06:00:00', '2017-08-17 07:00:00', '2017-08-17 08:00:00', '2017-08-17 09:00:00', '2017-08-17 10:00:00', '2017-08-17 11:00:00', '2017-08-17 12:00:00', '2017-08-17 13:00:00', '2017-08-17 14:00:00', '2017-08-17 15:00:00', '2017-08-17 16:00:00', '2017-08-17 17:00:00', '2017-08-17 18:00:00', '2017-08-17 19:00:00', '2017-08-17 20:00:00', '2017-08-17 21:00:00', '2017-08-17 22:00:00', '2017-08-17 23:00:00',
   '2017-08-18 00:00:00'
  ],
  datasets: [{
    label: 'Whatever',
    data: [
    null,
      1287.7695588,
      287.7695591,
      287.7695588,
      518.402393,
      349.3577694,
      985.989506,
      1068.015602,
      1630.221974,
      1616.020565,
      1583.739695,
      1593.674063,
      1543.705784,
      1634.344849,
      1671.942706,
      1740.257558,
      1835.411412,
      1655.565019,
      1345.900945,
      1286.365589,
      1156.972826,
      1131.793079,
      676.5477124,
      730.9662211,
      1623.7522991,
      null
    ],
    backgroundColor: '#a2c7db'
  }]
};

var ctxTest = document.getElementById("chartTest");
if (ctxTest) {
  var chartTest = new Chart(ctxTest, {
    type: 'bar',
    data: chartTestData,
    options: {
      responsive: true,
      legend: false,
      title: {
        display: true
      },
      scales: {
        xAxes: [{
          barPercentage: 0.8,
          categoryPercentage: 1.0,
          gridLines: {
            display: true,
          },
          offset: false,
          type: 'time',
          time: {
            unit: 'hour',
            unitStepSize: 6,
            displayFormats: {
              'hour': 'HH'
            }
          }
        }],
        yAxes: [{
          ticks: {
            beginAtZero: true
          },
          scaleLabel: {
            display: true
          }
        }]
      }
    }
  });
}