chart.js顏色不呈現

Question

我正在嘗試使用chart.js創建一個簡單的實時線/散點圖，z-indexed作為我的應用程序的背景。 出於某種原因，它呈現為不透明的灰色而不是我指定的偏紅色。 而且，即使我嘗試更改其他圖表元素和默認值，圖表也始終是灰色的。 我確定這是一個微不足道的修復，但我無法理解。

以下是具有完整代碼的JS Bin的鏈接。（您需要在圖表顯示任何數據之前設置並啟動計時器）此外，更具體地說，這是與創建圖表相關的JS代碼：

var ctx = document.getElementById('canvas').getContext("2d"),
points = [{x:0,y:0}],
lineData = {
    datasets: [{
        fillColor: "rgba(217, 108, 99, .9)",
        strokeColor: "rgba(255, 255, 255, 1)",
        pumpntHighlightStroke: "rgba(220,220,220,1)",
        data: points
    }]
},
lineOptions = {
    showScale: false,
    scaleShowLabels: false,
    scaleShowGridLines : false,
    pointDot : false,
    pointDotRadius : 0,
    pointDotStrokeWidth : 0,
    pointHitDetectionRadius : 0,
    datasetStroke : true,
    datasetStrokeWidth : 3,
    datasetFill : true,
};
Chart.defaults.global.elements.point.radius = 0;
Chart.defaults.global.legend.display = false;
Chart.defaults.global.tooltips.enabled = false;
Chart.defaults.global.animation.duration = 250;
Chart.scaleService.updateScaleDefaults('linear', {
    display: false,
    ticks: {
        beginAtZero: true,
        min: 0
    }
});
Chart.defaults.global.elements.line.tension = 0.05;
Chart.defaults.global.maintainAspectRatio = false;

myChart = new Chart(ctx, {
    type: 'scatter',
    data: lineData,
    options: lineOptions
});

感謝您的時間。 如果還有什么可以解釋的，請告訴我。

Answer 1

我認為這是因為你沒有使用正確的屬性。 根據文檔（ http://www.chartjs.org/docs/ ），您應該使用backgroundColor ，而不是fillColor 。

請參閱doc中的第一個示例： http ： //www.chartjs.org/docs/#getting-started-creating-a-chart

     datasets: [{
        label: '# of Votes',
        data: [12, 19, 3, 5, 2, 3],
        backgroundColor: [
            'rgba(255, 99, 132, 0.2)',
            'rgba(54, 162, 235, 0.2)',
            'rgba(255, 206, 86, 0.2)',
            'rgba(75, 192, 192, 0.2)',
            'rgba(153, 102, 255, 0.2)',
            'rgba(255, 159, 64, 0.2)'
        ],
        borderColor: [
            'rgba(255,99,132,1)',
            'rgba(54, 162, 235, 1)',
            'rgba(255, 206, 86, 1)',
            'rgba(75, 192, 192, 1)',
            'rgba(153, 102, 255, 1)',
            'rgba(255, 159, 64, 1)'
        ],
        borderWidth: 1
    }]

請注意， strokeColor也不存在。