然后调用fillStyle或者strokeStyle设置成渐变对象，就可以了。

gradient=context.createLinearGradient(-200,200,-100,300); gradient.addColorStop(0,'white'); gradient.addColorStop(1,'black'); context.fillStyle=gradient; context.fillRect(-200,200,100,100);

②创建放射渐变：

创建渐变对象：调用createRadialGradient（起点圆心x坐标，起点圆心y坐标，起点圆半径，终点圆x坐标，终点圆y坐标，终点圆半径）；

调用addColorStop()方法设置色标；

将fillStyle或者strokeStype设置成放射渐变对象。

gradientR=context.createRadialGradient(200,200,10,200,200,100); gradientR.addColorStop(0,'white'); gradientR.addColorStop(1,'blue'); context.fillStyle=gradientR; context.fillRect(100,100,200,200);