使用canvas画三角形

最新推荐文章于 2024-05-11 11:01:21 发布

weixin_30460489

最新推荐文章于 2024-05-11 11:01:21 发布

阅读量269

点赞数

文章标签： java python

原文链接：http://www.cnblogs.com/sea-stream/p/9891218.html

版权

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
 </head>

 <body>
<canvas id="canvas" width="500" height="500" style="background-color: yellow;"></canvas>
 <script>
var c=document.getElementById("canvas");
var cxt=c.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();
</script>
 </body>
</html>