Clear Canvas Rect (mas mantenha o fundo)

Estou tentando animar um círculo e apenas movê-lo horizontalmente, o que funciona bem. No entanto, enquanto o círculo está em movimento, eu tenho que fazer um clearRect sobre esse círculo para que ele se redesenha na direção horizontal. Quando faço um clearRect, ele também faz com que o fundo tenha uma caixa branca em torno de forma tão eficaz que será uma linha horizontal branca na direção em que o círculo está se movend

Existe uma maneira de limpar o círculo sem clearRect? Se eu tiver que continuar redesenhando o plano de fundo após limpar, retire a tela piscará quando houver 10 círculos se movendo nessa áre

Algumas outras abordagens para resolver isso?

    function drawcircle() {
        clear();    

        context.beginPath();
        context.arc(X, Y, R, 0, 2*Math.PI, false);                  
        context.moveTo(X,Y);            
        context.lineWidth = 0.3;
        context.strokeStyle = "#999999"; 
        context.stroke();

        if (X > 200)
        {
            clearTimeout(t); //stop
        }
        else
        {
            //move in x dir
            X += dX;
            t = setTimeout(drawcircle, 50);
        }
    }

    function clear() {
        context.clearRect(X-R, Y-R, 2*R, 2*R);
    }

questionAnswers(3)

yourAnswerToTheQuestion