老师看看这样好吗

来源：4-10 编程练习

光aaaaand影

2019-08-17 10:22:03

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>案例</title>
    <style>
        canvas{background-color:lightblue;}
    </style>
</head>
<body>
    <canvas id="canvas" width="600px" height="600px">您的浏览器不支持</canvas>
    <script>
        var canvas=document.getElementById("canvas");
        var ctx=canvas.getContext("2d");
      //在此处编写代码
        ctx.translate(300,300);
        ctx.arc(0,0,150,0*Math.PI,2*Math.PI);
        ctx.fillStyle="pink";
        ctx.fill();
        
        ctx.beginPath();
        for(i=0;i<4;i++){
            ctx.rotate(Math.PI/2);
            ctx.moveTo(130,0);
            ctx.lineTo(150,0);
        }
        ctx.strokeStyle="black";
        ctx.stroke();
        
        ctx.beginPath();
        //分针
        ctx.moveTo(0,0);
        ctx.lineTo(120,0);
        //时针
        ctx.rotate(Math.PI/24)
        ctx.moveTo(0,0);
        ctx.lineTo(0,-110);
        ctx.strokeStyle="blue";
        ctx.stroke();
    </script>
</body>
</html>

写回答

1回答