品牌网站建设解决方案

cxt.lineWidth="2": //设置线条颜色 cxt.beginPath(); //设置线条宽度 cxt.moveTo(50,20); //定位绘图起点 cxt.lineTo(150,80); //第一条直线的终点坐标 cxt.lineTo(20,60); //第二条直线的终点坐标 cxt.closePath();//封闭路径,使第一条直线的起点坐标与第二条直线的终点坐标闭合 cxt.stroke(); //绘制当前路径的边框 </script> </body> </html>案例说明本例中使用beginPath()方法初始化路径,第一次使用moveTo()方法改变当前绘画位置到cs0,20),接着使用两次lineTo()方法绘制三角形的两边,最后使用closePathO关l’羽路径形成三角形的第三边。81 3.绘制圆弧或圆 arc()方法使用一个中心点和半径,为一个画布的当前子路径添加一条弧,语法格式为: arc(x,y, radius, startAngle, endAngle, counterclockwise) 其中的参数含义如下。 x,y:描述弧的圆形的圆心坐标。 radius:描述弧的圆形的半径。 startAngle,endAngle:沿着圆指定弧的开始点和结束点的一个角度。这个角度用弧度来量,沿着x轴正半轴的三点钟方向的角度为0,角度沿着逆时针方向而增大。 i counterclockwise:弧沿着圆周的逆时针方向(True)还是顺时针方向(False)遍历。 说明:这个方法的前5个参数指定了圆周的一个起始点和一个结束点。调用这个方法会在当前点和当前子路径的起始点之间添加一条直线。接下来,它沿着圆周在子路径的起始点和结束点之间添加弧。最后一个counterclockwise参数指定了圆应该沿着哪个方向遍历来连接起始点和结束点。 案例5-11l绘制圆弧和圆。 案例展示本例文件5-ll.html在浏览器中的显示效果如图5-12所示。 学习目标掌握绘制圆弧和圆的方法。知识要点掌握绘制圆弧和圆的相关方法和属性。