javascript - portugues - Traducir un lienzo html5

traductor ingles

Question

Quiero saber cómo puedo traducir una escena completa ya dibujada en un lienzo html5, por ejemplo, 5 píxeles hacia abajo. Sé que el método de traducción simplemente traduce el sistema de coordenadas del lienzo, pero quiero saber si hay una forma de traducir toda la escena que ya está dibujada en el lienzo.

Answer 1

Puede aplicar las transformaciones y llamar a drawImage pasando en el lienzo.

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

Al hacer eso, los contenidos originales seguirán debajo. Dependiendo del efecto que intente lograr, configurar globalcompositeOperation puede ayudarlo con eso.

Pero es probable que necesite usar drawImage para copiar primero a un segundo lienzo, borrar la corriente, aplicar la transformación y extraer de la copia.

Answer 2

No, a menos que tomes una captura de pantalla y traduzcas eso.

Sin embargo, solo insertando

context.translate(0, 5)// or your values

justo antes de su código de dibujo debería hacer el truco.

Referencia: MDN Canvas Tutorial (Transformaciones)