HTML5 восстановить холст после очистки

Question

У меня есть функция, которая рисует коллекцию изображений на холсте и сохраняет ее после.

Затем в командной строке я запускаю:

canvas.save();
canvas.clearRect(0,0,415,415);
canvas.restore();

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

Answer 1

Вы можете использовать getImageData и putImageData для сохранения и восстановления содержимого холста.

tmp = context.getImageData(0,0,415,415);
context.clearRect(0,0,415,415);
context.putImageData(tmp,0,0);

Answer 2

Вы неправильно понимаете, что делает save.Он сохраняет состояние холста, на которое влияют rotate, translate, scale и т. Д. Он не сохраняет никакого реального содержимого холста.Если вы хотите сохранить то, что на самом деле находится на холсте, попробуйте сохранить его на скрытом холсте.Предполагая, что вы добавили скрытый холст в html и получили его объект контекста (canvas2), следующее должно его сохранить:

canvas2.drawImage(canvas, 0, 0)

А затем восстановить его:

canvas.drawImage(canvas2, 0, 0)