canvas入门（画圆）

<canvas id="myCanvas"></canvas>

var canvas = document.getElementById("myCanvas");
canvas.width =400;
canvas.height =400;          //canvas会覆盖页面的一个区域，同时也会阻止这个区域事件发生，所以在处理canvas区域的时候要慎重处理。

var ctx = canvas.getContext("2d");      //返回CanvasRenderingContext2D 对象，canvas画图是通过这个对象来画的。
//开始一个新的绘制路径
ctx.beginPath();
//设置弧线的颜色为蓝色
ctx.strokeStyle = "blue";
//沿着坐标点(100,100)为圆心
ctx.arc(circle.x, circle.y, circle.r,0,2*Math.PI,true);   画圆6个参数，圆心坐标、半径、起始和终止的角度。最后一个规定应该逆时针还是顺时针绘图。False = 顺时针，true = 逆时针
ctx.closePath();
ctx.fillStyle = 'rgb(200,0,200)';
ctx.fill();