5👍
You need to loop through the datasets and point and create tooltips in onAnimationComplete
(setting the events array to an empty array won’t work).
Just like before you have to remove the events from the events array so that the tooltips don’t disappear once you mouseover and mouseout, but in this case you need to set events
to false
.
Also, I think the version in dev when I last checked had a problem with onAnimationComplete not triggering unless the animation
duration
was 0
.
Here is the relevant code
var config = {
type: 'pie',
options: {
events: false,
animation: {
duration: 0
},
onAnimationComplete: 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({
_chart: self.chart,
_data: self.data,
_options: self.options,
_active: [element]
}, self);
tooltip.update();
tooltip.transition(Chart.helpers.easingEffects.linear).draw();
}, self);
}, self);
}
},
Fiddle – https://jsfiddle.net/c8Lk2381/
- [Chartjs]-Chart.js axes label font size
- [Chartjs]-Line chart is showing under bar in combochart in chartjs
5👍
This worked for me:
events: [],
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,
_active: [element]
}, self);
tooltip.update();
tooltip.transition(Chart.helpers.easingEffects.linear).draw();
}, self);
}, self);
}
}
- [Chartjs]-Different color for line segments in ChartJS
- [Chartjs]-Is it possible to add a drop shadow to chart.js line chart?
Source:stackexchange.com