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代码帮助差异需要

回答

相关问题