html5使用canvas画三角形

html5使用canvas画三角形

　　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();/pic/p>

　　/pic/p>

　　cxt.strokeStyle="red";

　　cxt.stroke();

　　/pic/p>

　　cxt.beginPath();

　　cxt.moveTo(350,50);

　　cxt.lineTo(300,200);

　　cxt.lineTo(400,300);

　　cxt.closePath();

　　cxt.fill();

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

　　代码如下:

　　var canvas=document.getElementById("canvas");

　　var cxt=canvas.getContext("2d");

　　cxt.font="40px 黑体";

　　/pic/p>

　　cxt.fillStyle="red";/pic/p>

　　cxt.fillText("hello,思思博士",10,50);

　　/pic/p>

　　cxt.strokeStyle="red";/pic/p>

　　cxt.strokeText("hello,思思博士",10,100);

【html5使用canvas画三角形】相关文章：

html5的canvas方法使用01-19

HTML5中Canvas的事件处理介绍02-06

HTML5中canvas标签实现刮刮卡效果10-29

基于html5 canvas实现漫天飞雪效果的方法01-15

HTML5的Audio标签使用详解02-19

php使用html5实现多文件上传实例02-27

html5中的input新属性range使用记录12-14

HTML5中你如何使用CSS建立不可选的文字12-14

24个canvas基础知识小结03-08