/创建canvas : /
var canvas = document.getElementById("myCanvas");
//建议使用width,height属性设置画布的太小,而样式设置宽高仅仅是画布的显示区域,不包括画布的分辨率
canvas.width=824;
canvas.height=668;
var context = canvas.getContext("2d"); //绘图的上下文环境
/*绘制直线:Draw a line */
context.moveTo(100,100); //起点 、、状态设置
context.lineTo(700,700); //终点 、、状态设置
context.lineTo(100,700); //终点 、、状态设置
context.lineTo(100,100); //终点 、、状态设置
//填充
context.fillStyle="rgb(2,100,30)"
context.fill();
//描边
context.lineWidth = 5;
context.strokeStyle = "#005588"
context.stroke(); //绘图是基于状态的,绘制
context.closePath(); // 结束路径
context.beginPath();// 开始路径
/*绘制圆和弧线*/
context.arc(300,300,200,0,1.5*Math.PI);
context.stroke();