CODEWITHSUNDEEP
javascriptchartschart.js
Droide
Droide

Reputation: 1859

Tooltips in Chart js are always black instead of the color of the corresponding dataset

I'm using chart js, and I have multiple dataset...

I have a problem with the tooltips, indeed the square which should indicates the color of a dataset is always black..

Why?

Here the code: 

                fattureChart = new Chart(ctx, {
                    type: 'line',
                    data: {
                        labels: labels,
                        datasets: mydatasets
                    },
                    options: {
                        responsive: true,
                        tooltips: {
                            mode: 'index',
                            intersect: false,
                        },
                        animation:{
                            easing: 'easeOutElastic',
                            duration: 2500
                        },
                        plugins: {
                            filler: {
                                propagate: true
                            }
                        },
                        scales: {
                            xAxes: [{
                                display: true,
                                scaleLabel: {
                                    display: true,
                                    labelString: 'PERIODO'
                                }
                            }],
                            yAxes: [{
                                display: true,
                                scaleLabel: {
                                    display: true,
                                    labelString: 'EURO'
                                },
                                ticks: {
                                    beginAtZero:true
                                }
                            }],
                        }
                    }
                });
            }
         });

Here I have an array of color:

var backgroundColor = [
                '#0db02bc7', 
                '#0daf87c7',
                '#afaf0dc7',
                '#0cb0aac7', 
                '#0c97b0c7'
            ];

Upvotes: 1

Views: 1812

Answers (1)

Teo
Teo

Reputation: 3213

Your have that problem because you are using the hexadecimal code instead of the rgba.. Try to replace them..

Upvotes: 6

Related Questions