Резиновая лента в HTML5

Question

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

Answer 1

Вопрос немного сложен для понимания, но я предполагаю, что вы хотите сделать следующее, используя getImageData и putImageData:

// save the entire canvas (in this example, its 500 x 500) to be restored later
image = context.getImageData(0, 0, 500, 500);

function draw() {
   context.clearRect(0, 0, canvas.width, canvas.height); // clear entire canvas
   context.putImageData(image, 0, 0); // restore entire canvas saved previously
   /** Now, draw other stuff on top of the canvas **/
}

Answer 2

Вы просто должны отслеживать каждый отдельный объект, который хотите нарисовать, и перерисовывать каждый из них в каждом кадре.

Вы можете немного оптимизировать процесс, но вы должны отслеживайте каждую нарисованную вещь, чтобы вы могли перерисовать ее.

Answer 3

Вам необходимо перерисовать часть фона, занятую черным прямоугольником. Может быть проще просто перерисовать весь фон.