How to set time on y-axes in chart js, I have the data in HH:mm format and distribute data on stacked bar chart for x-axes as date and y-axes in HH:mm

Question

I am getting time data which I want to display in stacked bar chart. I have been able to plot dates on x-axes in chart js with the time format as per the documentation. I want to display time in HH:mm format on y axis. Moreover, the data I am getting is in HH:mm format on not a whole date.

I have searched for it everywhere and can't seem to find a viable solution. The chart js documentation states that we should have a valid time in our chart js to display, but I am getting data in HH:mm format.

function stackedBarChartForProject(){
  var dataPack1 = [11.2, 12.2, 1.59, 11.25, 1.45, 11.2, 11.2, 9.2, 18.2, 3.2, 11.2, 11.2];
  var dataPack2 = [9.05, 11.3, 9.05, 11.3, 9.05, 11.3, 9.05, 11.3, 9.05, 11.3, 9.05, 11.3];
  var dates = [moment(new Date('Tue, 30 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Mon, 29 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Sun, 28 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Sat, 27 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Fri, 26 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Thu, 25 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Wed, 24 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Tue, 23 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Mon, 22 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Sun, 21 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Sat, 20 Oct 2018')).format('YYYY-MM-DD'), moment(new Date('Fri, 19 Oct 2018')).format('YYYY-MM-DD')];
  if ($('#project_stacked_bar_chart_canvas').length) {
    var stackChart = document.getElementById("project_stacked_bar_chart_canvas");
    var myStackChart = new Chart(stackChart, {
      type: 'bar',
      data: {
        labels: dates,
        datasets: [
          {
            label: 'Bowser',
            data: dataPack1,
            backgroundColor: "rgba(55, 160, 225, 0.7)",
            hoverBackgroundColor: "rgba(55, 160, 225, 0.7)",
            hoverBorderWidth: 2,
            hoverBorderColor: 'lightgrey'
          },
          {
            label: 'Mario',
            data: dataPack2,
            backgroundColor: "rgba(225, 58, 55, 0.7)",
            hoverBackgroundColor: "rgba(225, 58, 55, 0.7)",
            hoverBorderWidth: 2,
            hoverBorderColor: 'lightgrey'
          },
        ]
      },
      options: {
        animation: {
          duration: 10,
        },
        scales: {
          xAxes: [{
            stacked: true,
            gridLines: { display: false },
            type: 'time',
            time: {
              displayFormats: {
                'millisecond': 'YYYY-MM-DD',
                'second': 'YYYY-MM-DD',
                'minute': 'YYYY-MM-DD',
                'hour': 'YYYY-MM-DD',
                'day': 'YYYY-MM-DD',
                'week': 'YYYY-MM-DD',
                'month': 'YYYY-MM-DD',
                'quarter': 'YYYY-MM-DD',
                'year': 'YYYY-MM-DD',
              }
            },
            ticks: {
              source: 'data'
            }
          }],
          yAxes: [{ 
            stacked: true
          }],
        },
        legend: {display: true}
      }
    });
  }
}

I want to display the y axis ticks in HH:mm format.