554day(绘制一个填充的三角形.html)

本文介绍如何使用HTML5的canvas元素绘制并填充一个三角形。通过moveTo和lineTo方法定义三角形的三个顶点,利用closePath方法确保路径闭合,最后通过fill方法完成填充。文章还展示了如何设置线宽和描边。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

《2019年4月11日》【连续 554天】

标题:绘制一个填充的三角形.html;
内容:

  var myCanvas = document.querySelector('canvas');
    var ctx = myCanvas.getContext('2d');

    /*1.绘制一个三角形*/
    ctx.moveTo(100,100);
    ctx.lineTo(200,100);
    ctx.lineTo(200,200);
    /*起始点和lineTo的结束点无法完全闭合缺角*/
    /*使用canvas的自动闭合 */
    //ctx.lineTo(100,100);
    /*关闭路径*/
    ctx.closePath();

    ctx.lineWidth = 10;
    /*2.描边*/
    ctx.stroke();
    /*3.填充*/
    //ctx.fill();

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值