Chart.js庫V.2將光標更改爲不允許

使用Chart.js庫V.2時，我想在將鼠標懸停在條形圖上時將光標更改爲'not-allowed'。Chart.js庫V.2將光標更改爲不允許

這裏是我的代碼

  // Draw Chart 
     var ctx = document.getElementById("main").getContext("2d"); 

     ctx.canvas.width = calculatedWidth; 
     ctx.canvas.height = calculatedHeight || 400; 
     mainDashboardChart = new Chart(ctx, { 
      type: 'bar', 
      data: dashboardDatas, 
      yLabels: 0, 
      options: dashboardOptions('noSubChart', suggestedMaxVal, subChartDataLength) 
     });

我無法找到一個方法來做到這一點。有人知道這是否可能？

來源

2017-04-05 Tommy_verda

您是否嘗試過使用CSS這個？像#main {cursor：not-allowed;} – CodeMonkey

然後整個畫布將獲得該屬性，而不僅僅是活動圖表區域。 –

您將能夠通過getElementAtEvent方法獲得活動點。

因此，代碼將

var helpers = Chart.helpers; 
helpers.bindEvents(mainDashboardChart, ["mousemove", "touchstart", "touchmove", "mouseout"], function(evt){ 
var activeElement = mainDashboardChart.getElementAtEvent(evt); 
$('#main').css('cursor',activeElement.length ? 'not-allowed' : 'default'); });

來源

2017-04-05 11:31:21 Riju

這個爲我tx哥們工作。 –

你可以用hover選擇這樣玩：

hover: { 
    onHover: function(e) { 
     $("#myChart").css("cursor", e[0] ? "pointer" : "default"); 
    } 
}

工作圓環圖上的例子：https://jsfiddle.net/Tintin37/s9m6mggL/1/

來源

2017-04-05 11:33:19

感謝您的快速支持 –

Chart.js庫V.2將光標更改爲不允許

回答

相關問題