来自 chartjs-node-canvas 的黑色图表答案

【问题标题】：Black chart from chartjs-node-canvas来自 chartjs-node-canvas 的黑色图表
【发布时间】：2019-06-14 06:49:33
【问题描述】：

我在 Protractor 测试中使用 chartjs-node-canvas 库（在 JavaScript 中）。但不知何故，我的图表完全是黑色的（很难说是黑色，因为我只能看到正方形的白框，没有内容）。我做错了什么？

我把所有代码行都放在了 t afterAll 部分，因为我的 .json 是测量的结果。因为我通过 fs.readFileSync 导入了我的 .json，所以我将其解析为在我的配置下使用，例如：

 const getJson = fs.readFileSync(`file.json`);
 const json = JSON.parse(getJson);
const labels = json.map(function(item) {
        return item.a;
    });    
const data = json.map(function(item) {
        return item.b;
    });
const configuration = {
      type: 'line',
      data: {
        labels: [labels],
        datasets: [{
          label: 'AAA',
          data: [data],
          borderColor: 'rgba(75, 192, 192, 1)',
          backgroundColor: 'rgba(75, 192, 192, 0.2)',
          }]
      },
    };
const chartCallback = (Chart) => {
    Chart.defaults.global.hover.mode = "nearest";
    Chart.defaults.global.defaultFontFamily = 'VTKS UNAMOUR';
  };

我的数据似乎没问题，因为作为数据和标签，我收到了值的数组。最后我使用了它：

const canvasRenderService = new CanvasRenderService(width, height, chartCallback);
const image = canvasRenderService.renderToBufferSync(configuration );
fs.writeFileSync(`chart.png`, image);

我做错了什么？ png 生成为带有正方形框架的空白页面。

PS 根据https://github.com/SeanSobey/ChartjsNodeCanvas/issues/9 我试过了

const chartjs = require('chart.js');
const canvasRenderService = new CanvasRenderService(width, height, undefined, undefined, () => chartjs);

但效果一样。

【问题讨论】：

github.com/chartjs/Chart.js/issues/2830#issuecomment-227867969

标签： javascript node.js canvas charts chart.js

【解决方案1】：

我从数据集中删除了数组，并在没有 chartCallback 的情况下使用了 CanvasRenderService。此外，在 github 问题中提到了黑色背景。

【讨论】：