在 chart.js 中未触发 onHover 事件

z f*_*z f 3 jquery cursor onhover chart.js

当鼠标在图表上移动时,我想更改光标,就像这个 fiddle。这适用于 chart.jsv2.4但不适用于v2.6&v2.7 任何想法?

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";
    */
  }
 }
 }
  });
Run Code Online (Sandbox Code Playgroud)

Pra*_*yal 5

v2.5以后 onHover 回调的参数已更改。见PR#3669

onHover 回调现在有 3 个参数。第二个参数是触发悬停的事件。这样做是为了与 onClick 回调保持一致。

function(event, activeElements) {

}
Run Code Online (Sandbox Code Playgroud)

以前,activeEvents 是第一个参数,并且没有传递事件。

您可以查看v2.5 的发行说明

所以你必须改变你onHover callback的如下:

  onHover: function(event,elements) {
    $("#canvas1").css("cursor", elements[0] ? "pointer" : "default");
  }
Run Code Online (Sandbox Code Playgroud)

更新了 jsFiddle