javascript - Chart.js数据背景色覆盖点背景色

Question

我正在使用 Chart.js .我有一条具有特定颜色的数据线。我希望这些数据线的点具有不同的颜色。根据文档，您可以使用 Chart.defaults.global.elements.point.backgroundColor

执行此操作

 var ctxLine = document.getElementById("lineChart").getContext('2d');
 lineChart = new Chart(ctxLine, {
 type: 'line',
 data: {
     labels: dates,
     datasets: [{
           data: ['...'],
           backgroundColor: "rgba(52,152,219,0.4)"
       }]
 },
 options: {
    elements: {
         point: {
              borderColor: "rgb(255,255,0)",
              backgroundColor: "rgb(255,0,0)"
          }
      }                     
   }
});

point.borderColor 工作正常，但 point.backgroundColor 仅在我删除第一个 backgroundColor 字段时工作。

Answer 1

我自己找到了解决方案。我不知道有不同版本的 chart.js

我正在使用 v2.0 并且存在一个名为 pointBackgroundColor 的属性

var ctxLine = document.getElementById("lineChart").getContext('2d');
lineChart = new Chart(ctxLine, {
type: 'line',
data: {
     labels: dates,
     datasets: [{
           data: ['...'],
           backgroundColor: "rgba(52,152,219,0.4)",
           pointBackgroundColor: "#fff"
       }]
}
});