Очистить прямоугольник холста (но сохранить фон)

Я пытаюсь анимировать круг и просто перемещаю его по горизонтали, что отлично работает. Однако пока круг движется, мне нужно сделать clearRect над этим кругом, чтобы он перерисовал себя в горизонтальном направлении. Когда я делаю clearRect, он также заставляет фон иметь белый прямоугольник, так что это будет одна белая горизонтальная линия в направлении движения круга.

  1. Есть ли способ очистить круг без clearRect?
  2. Если мне придется перерисовывать фон после clearRect, холст будет мерцать, когда в этой области движутся, скажем, 10 кругов.

Есть ли другие подходы к решению этой проблемы?

    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);
    }
13
задан Phrogz 8 April 2011 в 20:57
поделиться