无法获取ChartJS xAxes以分钟和秒显示

Question

我有一个锻炼生成器，它在MySQL DB中将时间显示为TIME。这些锻炼需要包括一个小时的训练，但大多数训练都在一个小时之内，例如23分钟10秒。使用chart.js，我需要能够在xAxes上以分钟和秒为单位显示时间

我的锻炼图表

    <canvas id="chart" style="width: 100%; height: 60vh; background: white; border: 1px solid #555652; margin-top: 10px;"></canvas>

    <script>
    var ctx = document.getElementById("chart").getContext('2d');
    var myChart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: [1,2,3,4,5,6,7,8,9,10,11,12,13,14,14,16,17,18,19,],
            datasets:
                    [{
                            label: 'Time Performed',
                            data: [<?php echo $data1; ?>],
                            backgroundColor: 'orange',
                            borderColour: 'rgba(255,99,132)',
                            fill: false,
                            borderwidth: 1
                    },
                            {
                            label: 'RPE',
                            data: [<?php echo $data2; ?>],
                            backgroundColor: 'green',
                            borderColour: 'rgba(255,99,132)',
                            fill: false,
                            borderwidth: 1 
                }]

        },

        options: {
        scales: {scales:{yAxes: [{beginAtZero: true}], xAxes: [{autoskip: true, maxTicketsLimit: 20}]}},
        tooltips:{mode: 'index'},
        legend:{display: true, position: 'top', labels: {fontColour: 'rgb(255,255,255)', fontSize: 16}}
        }
    });