[Solved]-chart.js remove on hover effect-Chart.js

if you want to disable the hover effect and hide tooltips, remove the hover event from the configuration: http://www.chartjs.org/docs/latest/general/interactions/events.html

i'm guessing that you don't want any events (just like i did on my chart), so pass this in your options

options: { events: [] }

just set the hoverbackgroundcolor property to the same value as backgroundcolor. then on hover will not change the bar color.

here is an example​ of how your data object would look like using the hoverbackgroundcolor.

var data = {
    labels: ["january", "february", "march", "april", "may", "june", "july"],
    datasets: [
        {
            label: "my first dataset",
            backgroundcolor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            hoverbackgroundcolor: [
                'rgba(255,99,132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderwidth: 1,
            data: [65, 59, 80, 81, 56, 55, 40],
        }
    ]
};