2017-10-09 152 views
1

我正在使用Chart.js。我有一條具有特定顏色的數據線。我希望這些數據線的點的顏色不同。根據該文件,你可以用Chart.defaults.global.elements.point.backgroundColorChart.js數據背景顏色覆蓋點背景顏色

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只有努力做到這一點。

回答

0

我自己找到了解決方案。我不知道有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" 
     }] 
} 
}); 
0

它看起來像Chart.defaults.global.elements.point.backgroundColor只需要一個單獨的顏色字符串。

我不相信將有可能有不同的顏色點。 Here is the documentation page for it.

我試圖將數組插入到backgroundColor屬性中,但默認爲不同的顏色。 Have a look at this fiddle,如果你想玩。

您可以隨時提交功能請求。