HTML5画布线性渐变不'；我不工作

尝试使用createLinearGradient时遇到问题

//linear gradient
canvas.beginPath();
canvas.arc(350,400,100,0,2*Math.PI,false);
canvas.strokeStyle = 'lightblue';

var grad = canvas.createLinearGradient(350,110,100,0);  //(x0,y0) to (x1,y1)
grad.addColorStop(0,'red');
grad.addColorStop(1,'yellow');
grad.fillStyle = grad;
canvas.fill();
canvas.stroke();

问题是圆上的线性梯度不起作用。圆圈本身显示良好

在这段代码之前，我有“canvas.fillStyle=‘green’；”，所以圆圈是绿色的，而不是红色或黄色。所以也许我忘了什么

谢谢！

---

（顺便说一句，我使用chrome，这种效果在其他东西上也能很好地发挥作用）

canvas.fillStyle=grad，而不是
grad.fillStyle=grad

另一个问题是让渐变完全符合您的要求：）

现在它看起来都是红色的，但是如果你改变x/y值，你就能看到渐变。例如：

var grad=canvas.createLinearGradient（350110100330）

我会成功的



我认为您不应该调用上下文
canvas
。我建议改为使用
ctx
或
context
。这没什么大不了的，但总有一天你会把合作者搞糊涂的