Canvans 入门

cavans常用功能
 canvas
  var c=document.getElementById("myCanvas");
  var ctx=c.getContext("2d");
  ctx.fillStyle 颜色
  ctx.fillRect(x,y,width,height) 
  ctx.moveTo(x,y) 开始坐标
  ctx.lineTo(x,y) 结束坐标
  ctx.stroke(); 链接到一起
  ctx.arc(95,50,40,0,2*Math.PI);  画圆
  ctx.fillText(text,x,y);     画文字
  ctx.strokeText(text,x,y)  空心得文本
  ctx.font="30px Arial";  字体 字大小

  // 创建渐变
  var grd=ctx.createLinearGradient(0,0,200,0);
  grd.addColorStop(0,"red");
  grd.addColorStop(1,"white");
 
  // 填充渐变
  ctx.fillStyle=grd;
  ctx.fillRect(10,10,150,80);
  把一幅图像放置到画布上, 使用以下方法:
  drawImage(image,x,y)