canvas小知识

我在默默地期待，相信自己的存在，现实中的无奈，最后终于信赖，眼泪流下一瞬间才明白无奈的句子说说心情！

Canvas 画布

1.获取canvas对象

（1）获取绘图上下文
        var gd = oC.getContext('2d');
（2）重新开始路径
        gd.beginPath();
（a）起始点
        gd.moveTo(x,y);
（b）目标点
        gd.lineTo(x,y);
（3）设置描边颜色
         gd.strokeStyle = 'color';
（4）设置线宽
         gd.lineWidth = width;
（5）描边
         gd.stroke();
（6）填充颜色
         gd.fillStyle = 'color';
（7）填充
          gd.fill();
（8）闭合路径
          gd.closePath();

2.现有图形

rect        矩形
a)
    gd.rect(x,y,w,h);
    gd.stroke()/fill();
b)  
    gd.strokeRect(x,y,w,h);
    或
    gd.fillRect(x,y,w,h);
清屏  
gd.clearRect(x,y,w,h);
清屏-》改变值-》重新画

3.画弧

gd.arc(cx,cy,r,s,e,d);
    cx,cy           圆心位置
    r               半径
    s               开始的弧度
    e               结束的弧度
    d               是否逆时针

4.文字

gd.font="大小 类型";
gd.textAlign            水平对齐    center
gd.textBaseline         基线对齐    middle
gd.strokeText(str,x,y);
gd.fillText(str,x,y);

5.渐变

var lg = gd.createLinearGradient(x1,y1,x2,y2);
lg.addColorStop(0-1,color);
var rg = gd.createRadialGradient(cx1,cy1,r1,cx2,cy2,r2);
rg.addColorStop(0-1,color);