Canvas 画布-渐变中的RGBA不工作

我只想用rgba用渐变填充一个对象。然而，屏幕上没有显示任何内容，简单的addcolorstop可以工作，只是不适用于rgba

这项工作：

var ctx=this.context；
var fillColor=ctx.createRadialGradient（100,100,10,100,100,70）；
fillColor.addColorStop（0.2，“绿色”）；
ctx.fillStyle=fillColor；
ctx.beginPath（）；
ctx.arc（对象x，对象y，对象r，0，2*Math.PI，真）；
ctx.closePath（）；
ctx.fill（）；

这并不是：

var ctx=this.context；
var fillColor=ctx.createRadialGradient（100,100,10,100,100,70）；
渐变加色停止（0.0，'rgba（0,0,0,1'）；
渐变加色停止（0.5，'rgba（0,0,0'）；
渐变加色停止（1.0，'rgba（0,0,0,1'）；
ctx.fillStyle=fillColor；
ctx.beginPath（）；
ctx.arc（对象x，对象y，对象r，0，2*Math.PI，真）；
ctx.closePath（）；
ctx.fill（）；

在我的例子中，两个例子都不起作用。如果我假设

this

是画布，那么应该使用

getContext（）

方法返回在画布上绘制的对象：

var ctx = canvas.getContext('2d');
var grd = ctx.createRadialGradient(100, 100, 10, 100, 100, 70);
grd.addColorStop(0, 'rgba(0,0,0,0)');
grd.addColorStop(1, 'rgba(0,0,0,1)');

ctx.fillStyle = grd;
ctx.beginPath();
ctx.arc(150, 150, 100, 0, 2 * Math.PI, true);
ctx.closePath();
ctx.fill();