Canvas

获取canvas对象

获取绘图上下文          var gd=oC.getContext('2d');
重新开始路径            gd.beginPath();
起始点                  gd.moveTo(x,y);
目标点                  gd.lineTo(x,y);
设置描边颜色             gd.strokeStyle='red';
设置线宽                 gd.lineWidth=20;
描边                     gd.stroke();
填充颜色                 gd.fillStyle='red';
填充                     gd.fill();
闭合路径                  gd.closePath();

现有图形

1)矩形  
    a)        
        gd.rect(x,y,w,h)
        gd.stroke()/fill(();
    b)
        gd.strokeRect(x,y,w,h);
         gd.fillRect(x,y,w,h);
2)画弧（画圆）   
        gd.arct(cx,cy,r,s,e,d)
        gd.stroke()/fill(();

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


  角度-》弧度
    n*Math.PI/180
  弧度-》角度
  n*180/Math.PI

清屏

  gd.clearRect(x,y,w,h);
  清屏-》改变值-》重新画

帧频
      低帧频
        高帧频

文字

     gd.font="大小 类型";
     gd.textAlign='center';
     gd.textBaseline='middle'
     gd.strokeText(str,x,y);
     gd.fillText(str,x,y);

渐变

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