国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

Canvas繪製線條

Context物件的beginPath方法表示開(kāi)始繪製路徑，moveTo(x, y)方法設(shè)定線段的起點(diǎn)，lineTo(x, y)方法設(shè)定線段的終點(diǎn)，stroke方法用來(lái)為透明的線段著色。 moveto和lineto方法可以多次使用。最後，也可以使用closePath方法，自動(dòng)繪製一條當(dāng)前點(diǎn)到起點(diǎn)的直線，形成一個(gè)封閉圖形，省卻使用一次lineto方法。

程式碼如下：

<body>
    <canvas id="demoCanvas" width="500" height="600">
    </canvas>
    <script type="text/javascript">
        //通過(guò)id獲得當(dāng)前的Canvas對(duì)象
        var canvasDom = document.getElementById("demoCanvas");
        //通過(guò)Canvas Dom對(duì)象獲取Context的對(duì)象
        var context = canvasDom.getContext("2d");
        context.beginPath(); // 開(kāi)始路徑繪制
        context.moveTo(20, 20); // 設(shè)置路徑起點(diǎn)，坐標(biāo)為(20,20)
        context.lineTo(200, 200); // 繪制一條到(200,20)的直線
        context.lineTo(400, 20);
        context.closePath();
        context.lineWidth = 2.0; // 設(shè)置線寬
        context.strokeStyle = "#CC0000"; // 設(shè)置線的顏色
        context.stroke(); // 進(jìn)行線的著色，這時(shí)整條線才變得可見(jiàn)
    </script>
</body>
繼續(xù)學(xué)習(xí)
||
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>huatu</title> <body> <canvas id="demoCanvas" width="500" height="600"> </canvas> <script type="text/javascript"> //通過(guò)id獲得當(dāng)前的Canvas對(duì)象 var canvasDom = document.getElementById("demoCanvas"); //通過(guò)Canvas Dom對(duì)象獲取Context的對(duì)象 var context = canvasDom.getContext("2d"); context.beginPath(); // 開(kāi)始路徑繪制 context.moveTo(20, 20); // 設(shè)置路徑起點(diǎn)，坐標(biāo)為(20,20) context.lineTo(200, 200); // 繪制一條到(200,20)的直線 context.lineTo(400, 20); context.closePath(); context.lineWidth = 2.0; // 設(shè)置線寬 context.strokeStyle = "#CC0000"; // 設(shè)置線的顏色 context.stroke(); // 進(jìn)行線的著色，這時(shí)整條線才變得可見(jiàn) </script> </body> </html>
提交重置程式碼