Javascript 更改节点js上ChartJS的背景

我在node.js上运行了以下简单代码：

var express = require('express');
var Canvas = require('canvas');
var Chart = require('nchart');

var app = express();

app.get('/', function (req, res) {
    var canvas = new Canvas(400, 200);
    var ctx = canvas.getContext('2d');

    var data = {
    labels: ["January", "February", "March", "April"],
    datasets: [
        {
            label: "My First dataset",
            fillColor: "rgba(0,0,0,0)", //transparent
            strokeColor: "#f15a42",
            pointColor: "#f15a42",
            pointStrokeColor: "#fff",
            pointHighlightFill: "#fff",
            pointHighlightStroke: "rgba(220,220,220,1)",
            data: [5, 9, 8, 1]
        }
    ]
    };

    var myChart = new Chart(ctx).Line(data, {});
    res.setHeader('Content-Type', 'image/png');
    canvas.pngStream().pipe(res);
});

var server = app.listen(3000, function () {
  var host = server.address().address;
  var port = server.address().port;

  console.log('app listening at http://%s:%s', host, port);
});

它生成以下PNG图像：

它有一个透明的背景。 我可以改变整个画布的背景（我希望它是纯白的），直到我将图表添加到画布中。这应该是一个ChartJS功能，但我找不到任何东西

如果我有一个HTML画布，我就可以这样做，但不知道如何处理节点。

scaleGridLineColor:“rgba（0,0,0,0）”

---

将其作为配置值之一传递

只需扩展Chart.js即可，如下所示

Chart.types.Line.extend({
    name: "LineAlt",
    draw: function () {
        Chart.types.Line.prototype.draw.apply(this, arguments);

        var ctx = this.chart.ctx;
        ctx.globalCompositeOperation = 'destination-over';
        ctx.fillStyle = 'rgba(0,0,255,0.2)';
        ctx.fillRect(0, 0, this.chart.width, this.chart.height);
        ctx.globalCompositeOperation = 'source-over';
    }
});

然后

...
new Chart(ctx).LineAlt(data);

---

---

Fiddle-

从文档中可以看出，这应该是网格线的颜色：//String-网格线的颜色scaleGridLineColor:“rgba（0,0,0,05）”，谢谢，这很有效，但我不确定原因：你能解释一下吗？当然。globalCompositeOperation是画布上下文属性，用于确定如何将新形状合并到画布位图中。默认值（source over）仅在所有现有形状上绘制新形状。destination over与之相反，即它在所有现有形状下绘制新形状-这就是我们所做的-我们在现有图表下用填充颜色填充画布。更多信息，请参阅。干杯