javascript - ChartJS-每个数据点不同的颜色(ChartJS - Different color per data point)

Question

Is there a way to set a different color to a datapoint in a Line Chart if its above a certain value?(如果折线图中的数据点高于特定值，是否可以为数据点设置不同的颜色？)

I found this example for dxChart - https://stackoverflow.com/a/24928967/949195 - and now looking for something similar for ChartJS(我发现这个例子dxChart - https://stackoverflow.com/a/24928967/949195 -现在寻找一个ChartJS类似的东西)

  ask by Xander translate from so

Answer 1

In updating to version 2.2.2 of ChartJS, I found that the accepted answer no longer works.(在更新到ChartJS的2.2.2版本时，我发现接受的答案不再起作用。)

The datasets will take an array holding styling information for the properties.(数据集将采用一个数组，其中包含属性的样式信息。) In this case:(在这种情况下：)

var pointBackgroundColors = [];
var myChart = new Chart($('#myChart').get(0).getContext('2d'), {
    type: 'line',
    data: {
        datasets: [
            {
                data: dataPoints,
                pointBackgroundColor: pointBackgroundColors
            }
        ]
    }
});

for (i = 0; i < myChart.data.datasets[0].data.length; i++) {
    if (myChart.data.datasets[0].data[i] > 100) {
        pointBackgroundColors.push("#90cd8a");
    } else {
        pointBackgroundColors.push("#f58368");
    }
}

myChart.update();

I found this looking through the samples for ChartJS, specifically this one: "Different Point Sizes Example"(我通过ChartJS的示例，特别是以下示例发现了这一点： “不同点大小示例”)