本文介绍了以编程方式打开和关闭Chart.js工具提示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
Chart.js 2.2.1
任何想法如何触发我悬停时运行的代码一个数据点,当我关闭鼠标时它会运行?我需要以编程方式显示和隐藏图表的工具提示。
Any idea how to trigger the code that runs when I hover over a datapoint, and that runs when I move the mouse off? I need to programmatically show and hide a chart's tooltip.
openTip(oChart, datasetIndex, pointIndex){
// how to open a specific tooltip?
}
closeTip(oChart, datasetIndex, pointIndex){
// how to close the same tooltip?
}
如果可以,我会展示示例代码,但我甚至不知道从哪儿开始。 没有帮助。
I would show sample code if I could, but I don't even know where to start. The chart method docs haven't helped.
推荐答案
下面的代码将处理一个或多个工具提示。
The code below will handle one or more tooltips.
function openTip(oChart,datasetIndex,pointIndex){
if(window.oChart.tooltip._active == undefined)
window.oChart.tooltip._active = []
var activeElements = window.oChart.tooltip._active;
var requestedElem = window.oChart.getDatasetMeta(datasetIndex).data[pointIndex];
for(var i = 0; i < activeElements.length; i++) {
if(requestedElem._index == activeElements[i]._index)
return;
}
activeElements.push(requestedElem);
//window.oChart.tooltip._view.body = window.oChart.getDatasetMeta(datasetIndex).data;
window.oChart.tooltip._active = activeElements;
window.oChart.tooltip.update(true);
window.oChart.draw();
}
function closeTip(oChart,datasetIndex,pointIndex){
var activeElements = window.oChart.tooltip._active;
if(activeElements == undefined || activeElements.length == 0)
return;
var requestedElem = window.oChart.getDatasetMeta(datasetIndex).data[pointIndex];
for(var i = 0; i < activeElements.length; i++) {
if(requestedElem._index == activeElements[i]._index) {
activeElements.splice(i, 1);
break;
}
}
window.oChart.tooltip._active = activeElements;
window.oChart.tooltip.update(true);
window.oChart.draw();
}
@BeetleJuice提供的完整解决方案 -
Complete solution provided by @BeetleJuice - https://jsfiddle.net/ucvvvnm4/5/
这篇关于以编程方式打开和关闭Chart.js工具提示的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!