ChartJS 2.0代碼幫助差異需要

我無法轉換下面的代碼以使用Chart.js 2.0。我的圖表對象被創建使用所需...ChartJS 2.0代碼幫助差異需要

var chart = new Chart({...constructor code here...});

，我已經想通了如何創建我的自定義工具提示和自定義的傳說，但我似乎無法弄清楚以下項目。

首先，我在圖表本身上綁定了一個單擊事件，因此當用戶單擊它時，它將調用自定義函數，傳入用戶單擊的片段（餅圖的一部分）。在之前的Chart.js 1.0版本中，我可以調用下面的代碼，它運行得很好。這將允許我查看.label和屬性以及該段的其他屬性。

// Pass the segment of the pie chart the user clicks into myCustomFunction() 
$('#chartDiv').click(function(evt) { 
    var activeSegment = chart.getSegmentsAtEvent(evt); 
    myCustomFunction(activeSegment); 
}).css('cursor','pointer');

我想不通的另一件事是我想要一個的mouseenter和鼠標離開事件添加到我的自定義圖例項。當用戶懸停在圖例項目上時，它將彈出該段的正確工具提示。當他們離開時，工具提示關閉。這是我在ChartJS 1.0上使用的代碼。

// Tie the legend to the chart tooltips 
var helpers = Chart.helpers; 
var chartLegend = document.getElementById("chartLegend"); 
helpers.each(chartLegend.firstChild.childNodes, function(legendNode, index){ 
    helpers.addEvent(legendNode, 'mouseenter', function(){ 
     var activeSegment = chart.segments[index]; 
     activeSegment.save(); 
     activeSegment.fillColor = activeSegment.highlightColor;     
     chart.showTooltip([activeSegment], true); 
     activeSegment.restore(); 
    });    
    helpers.addEvent(legendNode, 'mouseleave', function(){ 
     chart.draw(); 
    }); 
});

如果有人能幫我弄清楚，我將非常感激。謝謝！

來源

2016-12-06 Phil

對於onclick事件，您可以使用var activeSegment = chart.getElementAtEvent（evt）;

來源

2016-12-14 19:03:17 user3407386

ChartJS 2.0代碼幫助差異需要

回答

相關問題