For my project I need to show static tooltips on Bubble chart that render onComplete. I've helped myself with this thread HERE.
With a bit of modification my code looks like this:
tooltips: {
callbacks: {
title: function (tooltipItems, data) {
var index = tooltipItems[0].datasetIndex;
var title = data.datasets[index].label;
//return title;
},
label: function (tooltipItem, data) {
var item = tooltipItem.datasetIndex;
var name = data.datasets[item].label;
//return '(' + tooltipItem.xLabel + ',' + tooltipItem.yLabel + ')';
return name;
},
backgroundColor: 'rgba(63,15,255, 0.3)', // This isn't working??
}
},
events: false,
animation: {
duration: 0,
onComplete: function () {
var self = this;
var elementsArray = [];
Chart.helpers.each(self.data.datasets, function (dataset, datasetIndex) {
Chart.helpers.each(dataset.metaData, function (element, index) {
var tooltip = new Chart.Tooltip({
_chartInstance: self,
_chart: self.chart,
_data: self.data,
_options: self.options, //Probably need to change something here
_active: [element]
}, self);
tooltip.update();
tooltip.transition(Chart.helpers.easingEffects.linear).draw();
}, self);
}, self);
}
}
Could anyone offer some advice how to change the tooltip backgorund from transparent black to white (without box) so the items in chart are more readable?
I'm looking at this docs HERE and trying to figure it out.
