在chart.js中未触发onHover事件 [英] onHover event is not triggering in chart.js
问题描述
当鼠标在图表上移动时,我想更改光标,例如此小提琴 .
这适用于chart.js v2.4
,但不适用于v2.6
& v2.7
有什么主意吗?
I want to change the cursor when the mouse moves on the chart, something like this fiddle.
This works with chart.js v2.4
but not works with v2.6
& v2.7
any idea?
var ctx = document.getElementById("canvas1").getContext("2d");
var mychart = new Chart(ctx, {
type: 'doughnut',
data: {
labels: ['uno', 'dos', 'tres', 'cuatro'],
datasets: [{
data: [1, 2, 3, 4],
backgroundColor: ["#BDC3C7","#9B59B6","#E74C3C","#26B99A"]
}]
},
options: {
hover: {
onHover: function(e) {
$("#canvas1").css("cursor", e[0] ? "pointer" : "default");
/* without jquery it can be like this:
var el = document.getElementById("canvas1");
el.style.cursor = e[0] ? "pointer" : "default";
*/
}
}
}
});
推荐答案
从v2.5
开始,onHover回调的参数已更改.参见 PR#3669
From v2.5
onwards parameters of onHover callback has been changed. See PR#3669
onHover回调现在具有3个参数.第二个参数是事件 触发了悬停.这样做是为了与 onClick回调.
onHover callback now has 3 parameters. The 2nd parameter is the event that triggered the hover. This was done for consistency with the onClick callback.
function(event, activeElements) {
}
以前,activeEvents是第一个参数,而事件未传递.
Previously, activeEvents was the first argument, and event was not passed.
您可以查看 v2.5发行说明
因此,您必须按以下步骤更改onHover callback
:
So you've to change your onHover callback
as follows:
onHover: function(event,elements) {
$("#canvas1").css("cursor", elements[0] ? "pointer" : "default");
}
这篇关于在chart.js中未触发onHover事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!