javascript - 我正在使用 chartjs 节点画布来呈现图表，但是图表选项被忽略了

问题描述

我在节点中使用 Chart.js 和 Chart.js Node Canvas 来呈现图形，然后使用以下代码将它们保存到磁盘：

const width = 400; //px
const height = 400; //px
const { ChartJSNodeCanvas } = require('chartjs-node-canvas');

const chartCallback = (ChartJS) => {
    ChartJS.defaults.global.elements.rectangle.borderWidth = 2;
};

const canvasRenderService = new ChartJSNodeCanvas({ width, height, chartCallback});

(async () => {
    const configuration = {
        type: 'bar',
        data: {
            labels: ['Ravenclaw', 'Gryffindor', 'Hufflepuff', 'Slytherin'],
            datasets: [{
                label: 'House Points',
                data: [serverpointsarray[0], serverpointsarray[1], serverpointsarray[2], serverpointsarray[3]],
                backgroundColor: [
                    'rgba(54, 162, 235, 0.2)',
                    'rgba(255, 99, 132, 0.2)',
                    'rgba(255, 206, 86, 0.2)',
                    'rgba(75, 192, 192, 0.2)'
                ],
                borderColor: [
                    'rgba(54, 162, 235, 1)',
                    'rgba(255, 99, 132, 1)',
                    'rgba(255, 206, 86, 1)',
                    'rgba(75, 192, 192, 1)'
                ],
                borderWidth: 1,                                       
            }]
        },
        options: {
            scales: {
                y: {
                    type: 'linear',
                    beginAtZero: true,
                }
            }
        }
    };

    const imageBuffer = await canvasRenderService.renderToBuffer(configuration);
    fs.writeFileSync(`./housepoints/graph.png`, imageBuffer);
    })();

（serverpointsarray先前已定义）但是，更改选项部分中的任何内容对最终呈现的图形没有影响，我查看了 Chart.js 文档并尝试使用min,beginAtZero和更改颜色的选项，但是无论我添加什么都不会呈现结果的差异 - 选项似乎只是被忽略了

渲染结果： y 轴不是从零开始

问题似乎不在于选项本身，因为当我在 html 中使用这个确切的图表时，浏览器会很好地呈现图表中的内容。除非它与 chartjs-nodee-canvas 略有不同？

标签： javascriptnode.jschart.js

javascript - 我正在使用 chartjs 节点画布来呈现图表，但是图表选项被忽略了

问题描述

解决方案

推荐阅读