canvas 实现渐变色填充的三角形.docxVIP

第 第 PAGE 1 页 共 NUMPAGES 1 页 canvas 实现渐变色填充的三角形 canvas 实现渐变色填充的三角形canvas实现1. 绘制三角形// htmlYour browser does not support the canvas element.// javascriptvar triangle: any = document.getElementById（quot;trianglequot;）;var ctx = triangle.getContext（quot;2dquot;）; // canvas 绘制区域ctx.beginPath（）; // 开头绘制ctx.moveTo（0, 0）; // 起点A（0,0）ctx.lineTo（30, 0）; // 从起点A（0,0）绘制到B（30,0）ctx.lineTo（15, 16）; // 从B（30,0）绘制到C（15,16）2. 设置渐变色并填充// javascriptconst grd1 = ctx.createLinearGradient（0, 0, 0, 16）; // 渐变方向-Y轴grd1.addColorStop（0, quot;FFFFFFquot;）; //起始色彩grd1.addColorSto