angularjs - 如何突出显示图表.js中单击的甜甜圈部分？

我正在使用使用chart.js的angularjs和angularcharts，但是，我坚持一件事，即如何突出显示甜甜圈的单击部分，以便用户知道他/她选择了甜甜圈的那部分

最佳答案

最好的方法是更改​​单击部分的颜色。

在您的标记中:

<canvas ...chart-colors="$scope.colors" chart-click="$scope.clickFn"...> </canvas>

在您的控制器中:

$scope.clickFn = function(points, event) {
    if (!points || !points.length || !points.length > 0) { return; }

    var indexClicked = points[0]._index;
    $scope.colors[indexClicked] = '#9a9a9a' //your clicked color code
}

这样，下次您的范围摘要发生时，将使用您的单击部分和新的突出显示颜色重新绘制图表。

您也可以执行其他操作，例如为未单击的所有内容上色，禁用动画以使它不会对颜色变化产生弹性，等等。但是上述方法可以解决您的问题。