首页 > 解决方案 > 在 Chartjs 版本 3.5.1 为折线图设置背景颜色时遇到问题

问题描述

我已将我的 chartjs 版本更新为 3.5.1,但我无法为折线图设置背景颜色。边框颜色仍处于活动状态。这是我的代码:

const labels = [
  'January',
  'February',
  'March',
  'April',
  'May',
  'June',
];
const data = {
  labels: labels,
  datasets: [{
    label: 'My First dataset',
    backgroundColor: 'rgb(255, 99, 132)',
    borderColor: 'rgb(255, 99, 132)',
    data: [0, 10, 5, 2, 20, 30, 45],
    fill: true,
  }]
};
this.chart = new Chart(ctx, {
  type: 'line',
  data: data,
  options: this.options,
})

结果是: 在此处输入图像描述

谢谢你的帮助!

标签: angularchart.js

解决方案


这对我来说似乎工作得很好。我能想到的唯一一件事是您正在使用 treeshaking 导入并且没有像这样导入和注册填充插件:

import { Chart, Filler } from 'chart.js';

Chart.register(Filler)

或者,您也可以让 chart.js 导入并注册所有内容,这样您就不会遇到此类问题:

import Chart from 'chart.js/auto';

推荐阅读