javascript - canvas问题 为什么矩形可以画出来 圆却不可以

Question

$(document).ready(function (){

    width = window.innerWidth;
    height = window.innerHeight;

    canvas = document.getElementById('myCanv');        
    canvas.width = width;
    canvas.height = height;

    var c=document.getElementById("myCanv");
    var canv=c.getContext("2d");
    canv.fillStyle="#FF0000";

    canv.beginPath();
    var h = 20;


    var y = 0;
    
    function draw() {
        if (y < canvas.height/2) {
            canv.fillRect(170,y,15,1);
            canv.clearRect(170,y-15,15,1);
            y++;
        };

        if (y >= canvas.height/2) {
            canv.clearRect(170,y+21,15,1);
            y++;
        };

        if ( h < canvas.height/2) {
            canv.arc(70,h,15,0,Math.PI*2,true);
            h++;
        };
    };

    canv.closePath();
    canv.fill();

    setInterval(draw,15);

Answer 1

把canv.beginPath() 和 canv.closePath(); canv.fill(); 几个函数放到draw函数里面就画的出来了

详细见
https://jsfiddle.net/zL4sjxrf/4/