Question

我在网站上制作图表，我发现chart.js从json文件生成图表。一切都有效，但颜色......三个图表是三种灰色颜色，我想加油......

我错过了什么？

   var ctx = document.getElementById('speedchart').getContext('2d');
var myChart = new Chart(ctx, {
  type: 'line',
  data: {
    labels: ti,
    datasets: [{
      label: 'Latency',
      data: lt,
      fillColor: "rgba(151,187,205,0.5)",
      strokeColor: "rgba(0,255,0,1.0)"
    }, {
      label: 'Up speed',
      data: up,
      strokeColor: "rgba(255,0,0,0.4)"

   }, {
      label: 'Down speed',
      data: dw,
      strokeColor: "rgba(0,0,255,0.4)"

   }]
  }
});

Answer 1

好像你正在将chart.js 1.x语法与chart.js 2.x

混合使用

不要认为strokeColor是chart.js 2.x中的有效选项。

以下是如何添加颜色的示例。

[{
   label: 'Info',
   backgroundColor: "rgba(46, 44, 211, 0.2)",
   borderColor: "rgba(46, 44, 211, 0.5)",
   data: data
}

https://jsfiddle.net/brqc0tmw/4/

有关更多选项，请查看文档 http://www.chartjs.org/docs/#line-chart-dataset-structure

Chart.js失去了颜色

1 个答案: