创建一个canvas

canvasDom.onmousedown =function(e){letevent =e||window.event;            

cavs.moveTo(event.clientX-canvasDom.offsetLeft,event.clientY-canvasDom.offsetTop);            

canvasDom.onmousemove=function(e){letevent=e||window.event; 

document.onmouseup=function(){   

cavs.lineTo(event.clientX-canvasDom.offsetLeft,event.clientY-canvasDom.offsetTop);        

}    }

cavs.stroke();            

canvasDom.onmousemove=null;               

一个直角三角形

cavs.beginPath();       

 cavs.moveTo(100,100)        

cavs.lineTo(100,250)        

cavs.lineTo(350,250)        

cavs.closePath()        

cavs.fillStyle ="red"cavs.fill();        

cavs.storkeStyle ="blue"cavs.lineWidth ="8"cavs.stroke();复制代码

canvas画矩形

（先设置颜色再填充）

clearRect(x,y,width,height) 清除矩形内的区域

cavs.fillStyle  ="red"cavs.fillRect(300,200,200,100)        

cavs.fillStyle  ="blue"cavs.lineWidth =10cavs.fillRect(320,220,100,50)        

cavs.closePath()