1.canvas画布大小和canvas元素大小canvas大小分为两种，一种是canvas元素本身的大小，一种是canvas画布的大小canvas本身的大小可以通过style样式给set.canvas{宽度：100px;height:100px;}/*设置元素在浏览器中可见的大小*/canvas画布大小是通过元素宽高两个属性设置的，也可以通过jssize为画布设置。默认大小为300*150或varcanvas=document.getElementById("canvas");canvas.width=100;canvas.height=100;如果两个尺寸不一致的话，就是画出来的图形和想象中的图形有差距。2、扇形渐变语法：varcanvas=document.getElementById("canvas");varctx=canvas.getContext("2d");ctx.createRadialGradient(x1,y1,r1,x2,y2,r2);//创建一个以(x1,y1)为圆心、半径为r1的圆为圆心为(x2,y2)、半径为r2的圆的径向渐变对象渐变法可分为两种情况：两个圆同心,或者说两个圆属于包含关系Gradient从一个圆的圆周向另一个圆的圆周辐射//包含vargrb=ctx.createRadialGradient(245,175,20,285,175,75);grb.addColorStop(0,"红色");grb.addColorStop(0.5,"绿色");grb.addColorStop(1,"黄色");ctx.fillStyle=grb;ctx.fillRect(210,100,150,150);效果如下图：intersection或者距离在两个圆的切线和圆周范围内，从起始圆的圆周到结束圆的圆周。//相交grb=ctx.createRadialGradient(440,175,75,520,175,50);grb.addColorStop(0,"红");grb.addColorStop(0.5,"绿");grb.addColorStop(1,"黄");ctx.fillStyle=grb;ctx.fillRect(380,100,200,150);//grb=ctx.createRadialGradient(675,175,75,900,175,50);grb.addColorStop(0,"red");grb.addColorStop(0.5,"green");grb.addColorStop(1,"yellow");ctx.fillStyle=grb;ctx.fillRect(600,100,300,150);效果就像上图中的相交和分离，渐变在切线和圆周形成的范围内变化
