Hide/disable tooltips chart.js
Html5 Canvaschart.jsHtml5 Canvas Problem Overview
I'm trying to hide the tooltips in a line chart using chart.js.
I have tried this code, but they never hide.
Chart.defaults.global.tooltipenabled = false;
You can see all the code here of the chart:
https://jsfiddle.net/w6zs07xx/ Thanks!
Html5 Canvas Solutions
Solution 1 - Html5 Canvas
To turn off for a specific chart instead of in global defaults use this in the options object. Using v2.5.0
options: {
tooltips: {
enabled: false
}
}
Solution 2 - Html5 Canvas
For me showTooltips = false
didn't work.
My solution was:
Chart.defaults.global.tooltips.enabled = false;
My version is:
2.1.4
Solution 3 - Html5 Canvas
For v3.8
options: {
plugins: {
tooltip: {
enabled: false
},
}
}
Docs - https://www.chartjs.org/docs/latest/configuration/tooltip.html
Solution 4 - Html5 Canvas
You have the wrong property name. It should be
Chart.defaults.global.showTooltips = false;
Fiddle - https://jsfiddle.net/0tfvnmx1/
Solution 5 - Html5 Canvas
For v2.9.3:
options: {
tooltips: false
}
Solution 6 - Html5 Canvas
For 3+ the path is options.plugin.tooltip.enabled
.
Solution 7 - Html5 Canvas
use the following option for hide the tooltip
tooltips :{
custom : function(tooltipModel)
{
tooltipModel.opacity = 0;
}
}