绘制渐变图形

概念：

之前谈过使用canvas API绘制图形,现在介绍其他比较高级的绘制图形知识。

关于填充

使用fillStyle方法除了指定颜色以外，还可以用来指定填充的对象。

应用：

绘制线性渐变

function drawarc()
{
var canvas = document.getElementById('jianbian');
if(canvas == null)
return false;
var context = canvas.getContext('2d');
var gl = context.creatLinearGradient(0,0,0,300);
gl.addColorStop(0,'rgb(255,255,0)');
gl.addColorStop(0,'rgb(0,255,255)');
context.fillStyle = gl;
context.fillRect(0,0,400,300);
var n = 0;
var g2 = context.creatLinearGradient(0,0,300,0);
g2.addColorStop(0,'rgb(0,0,255,0.5)');
g2.addColorStop(1,'rgb(255,0,0,0.5)');
for(int i=0;i<10;i++)
{
context.beginPath();//开始创建路径
context.fillStyle = g2;
context.arc(i*25,i*25,i*10,0,Math.PI*2,true);
context.closePath();//关闭路径
context.fill();//填充图形
}
}