html5使用canvas画三角形

<canvas id="canvas" width="500" height="500" style="background-color: yellow;"></canvas>
 

复制代码

代码如下:

var canvas=document.getelementbyid("canvas");
var cxt=canvas.getcontext("2d");
cxt.beginpath();
cxt.moveto(250,50);
cxt.lineto(200,200);
cxt.lineto(300,300);
cxt.closepath();//填充或闭合 需要先闭合路径才能画
//空心三角形
cxt.strokestyle="red";
cxt.stroke();
//实心三角形
cxt.beginpath();
cxt.moveto(350,50);
cxt.lineto(300,200);
cxt.lineto(400,300);
cxt.closepath();
cxt.fill();