扇形.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<canvas width="800" height="400"></canvas>
<script>
    var canvas = document.querySelector("canvas");
    var cxt = canvas.getContext("2d");

    function aa(rad) {
        var num = rad * Math.PI / 180;
        return num;
    }

    var angle = 0;
    var r = 0;
    var g = 0;
    var b = 0;
    var timer = setInterval(function () {
        //cxt.clearRect(0, 0, 800, 400);
        cxt.beginPath();
        if (angle >= 362) {
            angle = 0;
            cxt.clearRect(0, 0, 800, 400);
        }
        if(r>=255){
            r = 0;
            g = 0;
            b = 0;
        }
        cxt.moveTo(200, 200);
        cxt.arc(200, 200, 100, 0, aa(angle));
        cxt.fillStyle = "rgb(" + Math.floor(Math.random()*255) + "," + g + "," + b + ")";
        cxt.fill();
        angle++;
        r++;
        b++;
        g++;
        //console.log(angle)
    }, 5)
</script>

</body>
</html>