【品牌網(wǎng)站建設(shè)解決方案】
cxt.lineWidth=”2”： ／／設(shè)置線條顏色
cxt.beginPath(); ／／設(shè)置線條寬度
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關(guān)l’羽路徑形成三角形的第三邊。
·81·
3．繪制圓弧或圓
arc()方法使用一個中心點和半徑，為一個畫布的當前子路徑添加一條弧，語法格式為：
arc(x,y, radius, startAngle, endAngle, counterclockwise)
其中的參數(shù)含義如下。
x，y：描述弧的圓形的圓心坐標。
radius:描述弧的圓形的半徑。
startAngle，endAngle：沿著圓指定弧的開始點和結(jié)束點的一個角度。這個角度用弧度來量，沿著x軸正半軸的三點鐘方向的角度為0，角度沿著逆時針方向而增大。 i
counterclockwise：弧沿著圓周的逆時針方向(True)還是順時針方向(False)遍歷。
說明：這個方法的前5個參數(shù)指定了圓周的一個起始點和一個結(jié)束點。調(diào)用這個方法會在當前點和當前子路徑的起始點之間添加一條直線。接下來，它沿著圓周在子路徑的起始點和結(jié)束點之間添加弧。最后一個counterclockwise參數(shù)指定了圓應(yīng)該沿著哪個方向遍歷來連接起始點和結(jié)束點。
【案例5-11l繪制圓弧和圓。
【案例展示】本例文件5-ll.html在瀏覽器中的顯示效果如圖5-12所示。
【學習目標】掌握繪制圓弧和圓的方法。
【知識要點】掌握繪制圓弧和圓的相關(guān)方法和屬性。
