javascript 如何始终在 Chart.js 2 上显示工具提示
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31241610/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to show tooltips always on Chart.js 2
提问by VictorArcas
How can I show tooltips always using Chart.js version 2 (alpha)?
如何始终使用 Chart.js 版本 2 (alpha) 显示工具提示？
I have tried this Chart.js - Doughnut show tooltips always?, but seems that this have changed in this last version.
我试过这个Chart.js - Donut 总是显示工具提示？，但似乎这在最后一个版本中发生了变化。
回答by Fagner Guimar?es
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);
}
}
回答by potatopeelings
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).
您需要遍历数据集并指向并创建工具提示onAnimationComplete（将事件数组设置为空数组将不起作用）。
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 eventsto false.
就像之前一样，您必须从事件数组中删除事件，以便鼠标悬停和鼠标移开后工具提示不会消失，但在这种情况下，您需要events将false.
Also, I think the version in dev when I last checked had a problem with onAnimationComplete not triggering unless the animationdurationwas 0.
另外，我认为我上次检查时 dev 中的版本存在 onAnimationComplete 不会触发的问题，除非animationduration是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/
小提琴 - https://jsfiddle.net/c8Lk2381/
