两个问题。

来源：3-8 编程练习

qq_鸭绿桥第一帅哥_0

2019-04-19 14:03:45

请老师检查作业。
关于.beginPath();老师能总结一下使用规律吗（我发现在直线后面再绘制图形，需要用.beginPath();在矩形后面绘制图形不需要.beginPath();）

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>canvas</title>
    <style>
    canvas {
        background-color: lightblue;
    }
    </style>
</head>

<body>
    <canvas id="canvas" width="800" height="800">
        您的浏览器不支持canvas
    </canvas>
    <script>
    //在此处写出代码
    var canvas=document.getElementById('canvas');
    var txt=canvas.getContext('2d');
    txt.moveTo(300,100);
    txt.lineTo(350,200);
    txt.stroke();
    txt.beginPath();
    txt.moveTo(500,100);
    txt.lineTo(450,200);
    txt.stroke();
    txt.strokeRect(300,200,200,100);
    txt.strokeRect(280,220,20,40);
    txt.strokeRect(500,220,20,40);
    txt.beginPath();
    txt.arc(340,240,10,0,2*Math.PI,true);
    txt.stroke();
    txt.beginPath();
    txt.arc(460,240,10,0,2*Math.PI,true);
    txt.stroke();
    txt.strokeRect(370,260,60,20);
    txt.strokeRect(350,300,100,200);
    txt.strokeRect(150,350,200,20);
    txt.strokeRect(450,350,200,20);
    txt.strokeRect(370,500,20,200);
    txt.strokeRect(410,500,20,200);
    </script>
</body>

</html>

写回答

1回答