Перевод холста html5

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

Ответы

Ответ 1

Вы можете применить преобразования и вызвать drawImage, проходящие в самом холсте.

ctx.save();
ctx.translate(0, 5);
ctx.drawImage(canvas, 0, 0);
ctx.restore();

При этом исходное содержимое будет по-прежнему ниже. В зависимости от эффекта, который вы пытаетесь выполнить, настройка globalCompositeOperation может помочь вам в этом.

Но, скорее всего, вам нужно будет использовать drawImage для первой копии на второй холст, очистить текущий, применить преобразование и извлечь из копии.