I am trying to update Data in a Chart.Js, keeping the maximum length of the data to 15, so removing the first element when the length of data surpasses 15. I have read the documentation on how to add and remove data on a Chart.js, and there is no problem adding data, but when it reaches 15 elements and tried to remove the data, it only add labels:

Here is the piece of code i used:

this.timeInterval = setInterval(async function () {
        let data = await $.ajax({
            method: 'get',
            url: any,
            data: {
                i: _this.iterationNum
            },
        });
        var date = new Date();
        let temperature = Number(data.temperature.substr(0, 4));
        
        if (_this.chart != null) {
            _this.chart.data.labels.push('' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds());
            _this.chart.data.datasets[0].data.push(temperature);
            if (_this.chart.data.labels.length > 15) {
                _this.chart.data.labels.shift();
                _this.chart.data.datasets[0].data.shift();
            }
            _this.chart.update();
        }
        else {
            this.sensorData.data.push(temperature);
            _this.sensorData.labels.push('' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds());
            if (_this.sensorData.data.length > 15) {
                _this.sensorData.data.shift();
                _this.sensorData.labels.shift();
            }
        }
        _this.iterationNum++;
        if (_this.iterationNum > 1000) {
            _this.iterationNum = 0;
        }
    }, 500);

And the Char have been configured as follows:

_this.chart = new Chart(ctx, {
        type: 'line',
        data: {
            labels: _this.sensorData.labels,
            datasets: [{
                data: _this.sensorData.data,
            }],
        },
        options: {
            scales: {
                yAxes: [{
                    ticks: {
                        beginAtZero: false
                    }
                }]
            },
            responsive: false,
            legend: {
                display: false,
            },
            mantainAspectRatio: false,

        }
    })

The ajax url have been removed intentionally of the code snippet.

Everything works fine till it reach 15 element and starts to remove data:

Before Reaching 15

After reaching 15

Does anyone know what may be happening?