学习c3h5

使用画布 canvas

1:创建画布
<canvas width="500" height="500" style="border: 1px solid #eeeeee"></canvas>

2:在script中获取画布
var ctx = document.querySelector('canvas').getContext('2d');
3:作画 如:画圆

        ctx.beginPath();//创建新的路径
        ctx.arc(250, 250, 200, 0, 2 * Math.PI);//调用画圆的方法  arc()
        ctx.strokeStyle = "yellow";//设置描边颜色
        ctx.lineWidth = 5;//设置描边宽大小
		ctx.fillStyle = 'rgb(60,253,126)'//设置填充颜色
		ctx.fill();//填充
        ctx.stroke();//描边
画直线
		ctx.beginPath();
		ctx.moveTo(100,100);//直线起点
		ctx.lineTo(300,100);//终点
		ctx.stroke();//描边
绘制图片 方法 drawImage()