Chartjs не работает правильно в стилях анимации и осей

Question

Я пытаюсь создать динамический код, включающий JS OOP, ES6 ... График правильно добавлен в HTML, однако у меня есть следующие проблемы:

1- При выполнении mouseHover изменяет цвет всех столбцов одновременно, но данные отображаются правильно.

2 - Не правильно добавляются наборы данных длякаждая соответствующая метка, кажется, что она вставляет все только в метку.

3 - Не работает ни одна функция, такая как onClick, onComplete, onProgress и, намного меньше, стили осей,например, удалить их.

class ChartVenda {
    constructor(_id, _data){
        this.id           = _id;
        this.data         = _data;
        this.chartElement = document.getElementById(_id).getContext('2d');
    }

    set chartObject(_object){ this.object = _object; }
    get chartObject(       ){ return this.object;    }

    get labels(){
        return ['jan', 'fev', 'mar', 'abr', 'mai', 'jun', 'jul', 'ago', 'set', 'out', 'nov', 'dez'];
    }

    get bgColors(){
        return [
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)',
            'rgb(202, 216, 229)'
        ]
    }

    get borderColors(){
        return [
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
            'rgba(0,0,0,0.3)',
        ]
    }

    createChart(){
        this.generateChart();
        this.addChartLabels();
        this.addChartDatasets();

        this.chartObject.update();
    }

    generateChart(){
        let chartVenda = new Chart(this.chartElement, {
            type: 'bar',
            data: {
                options: {
                    responsive:          true,
                    maintainAspectRatio: false,
                    legend: { display:   false },
                    scales: {
                        yAxes: [{
                            ticks: {
                                display:     false,
                                fontColor:   'white'
                            },
                            gridLines: {
                                display:    false,
                                drawBorder: false
                            }
                        }],
                        xAxes: [{
                            ticks: {
                                fontSize:    15,
                                fontColor:   'white'
                            },
                            gridLines: {
                                display:    false,
                                drawBorder: false
                            }
                        }],
                        onclick: function(){}
                    },
                    animation: {
                        duration: 1000,
                        onProgress: function() {
                            var chartInstance = this.chart,
                            ctx = chartInstance.ctx;
                            ctx.font = Chart.helpers.fontString('17', 'normal', Chart.defaults.global.defaultFontFamily);
                            ctx.fillStyle =    'white';
                            ctx.textAlign =    'center';
                            ctx.textBaseline = 'bottom';
                            Chart.helpers.each(this.data.datasets.forEach(function (dataset, i) {
                                var meta = chartInstance.controller.getDatasetMeta(i);
                                Chart.helpers.each(meta.data.forEach(function (bar, index) {
                                    var centerPoint = bar.getCenterPoint();
                                    ctx.fillText(dataset.data[index], centerPoint.x, centerPoint.y);
                                    }), this);
                            }), this);
                        },
                        onComplete: function() {
                            var chartInstance = this.chart,
                            ctx = chartInstance.ctx;
                            ctx.font = Chart.helpers.fontString('17', 'normal', Chart.defaults.global.defaultFontFamily);
                            ctx.fillStyle =    'white';
                            ctx.textAlign =    'center';
                            ctx.textBaseline = 'bottom';
                            Chart.helpers.each(this.data.datasets.forEach(function (dataset, i) {
                                var meta = chartInstance.controller.getDatasetMeta(i);
                                Chart.helpers.each(meta.data.forEach(function (bar, index) {
                                    var centerPoint = bar.getCenterPoint();
                                    ctx.fillText(dataset.data[index], centerPoint.x, centerPoint.y);
                                    }), this);
                            }), this);
                        }
                    }
                }
            }
        });

        this.chartObject = chartVenda;
    }

    addChartLabels(){
        let counterLabels = 0;
        this.data.records.forEach( () => {
            counterLabels += 1;
            this.chartObject.data.labels.push(this.labels[counterLabels-1]);
        });
    }

    addChartDatasets(){
        this.data.records.forEach( (_attr) => {
            this.chartObject.data.datasets.push({
                label:           `${_attr.Shopping} - ${_attr['Competência']}`,
                data:            [_attr['Δ% Venda m²']],
                backgroundColor: 'rgb(202, 216, 229)',
                borderColor:     'rgb(202, 216, 229)',
            });
        });

        console.log(this.chartObject.data.datasets)
    }


}