无法解析折线图(角度图.js)中的颜色



>我有两种类型的图表条形和折线。这是我的观点(苗条):

    canvas#line.chart.chart-line(
      ng-if="stateStats == 'global'"
      chart-data="data"
      chart-labels="labels"
      chart-colours="colours"
    )
    canvas#bar.chart.chart-bar(
      ng-if="stateStats != 'global' && data.length != 0"
      chart-data="data"
      chart-labels="labels"
      chart-options="optionsBarChart"
    )

我的颜色选项:

$scope.colours = [{
    fillColor: "rgba(151,187,205,0.2)",
    strokeColor: "rgba(151,187,205,1)",
    pointColor: "rgba(151,187,205,1)",
    pointStrokeColor: "#fff",
    pointHighlightFill: "#fff",
    pointHighlightStroke: "rgba(151,187,205,0.8)"
  }];

我的问题是我无法更改在折线图上显示数据的颜色。当我想将光标移到该点上时 - 我有错误:

未捕获的错误:无法解析对象 ["rgba(151,187,205,1)","rgba(220,220,220,1)"...]我做错了什么?

请确保您的数据在双数组上。

前任:

data = [
  [10, 20, 30, 20, 10]
];

我正在使用图表.js并且在将鼠标悬停在一个点上时也有同样的异常。当我将数据放在双数组中时,图表没有显示任何内容。

溶液:如果图表的类型为"折线",则它不会采用背景和边框的颜色数组,而是采用单色。这对我有用:

var chart = new Chart(chartCanvas, {
    type : 'line',
    data : {
        labels : dates,
        datasets : [{
                label : 'Error',
                data : errorCounts,
                backgroundColor : 'rgba(255, 99, 132, 0.2)',
                borderColor : 'rgba(255,99,132,1)',
                borderWidth : 1
            }, {
                label : 'Ok',
                data : okCounts,
                backgroundColor : 'rgba(75, 202, 72, 0.2)',
                borderColor : 'rgba(117,239,95,1)',
                borderWidth : 1
            }
        ]
    },
    options : {
        responsive : true,
        scales : {
            yAxes : [{
                    ticks : {
                        beginAtZero : true
                    }
                }
            ]
        }
    }
});

最新更新