translate()

Desplaza el sistema de coordenadas.

De forma predeterminada, el origen (0, 0) está en la esquina superior izquierda del lienzo en modo 2D y en el centro en el modo WebGL. La función translate() desplaza el origen a una posición diferente. Todo lo dibujado después de llamar a translate() parecerá estar desplazado. Hay dos formas de llamar a translate() con parámetros que establecen la posición del origen.

La primera forma de llamar a translate() utiliza números para establecer la cantidad de desplazamiento. Los dos primeros parámetros, x y y, establecen la cantidad de desplazamiento a lo largo de los ejes x- e y- positivos. Por ejemplo, llamar a translate(20, 30) desplaza el origen 20 píxeles a lo largo del eje x- y 30 píxeles a lo largo del eje y-. El tercer parámetro, z, es opcional. Establece la cantidad de desplazamiento a lo largo del eje z- positivo. Por ejemplo, llamar a translate(20, 30, 40) desplaza el origen 20 píxeles a lo largo del eje x-, 30 píxeles a lo largo del eje y- y 40 píxeles a lo largo del eje z-.

La segunda forma de llamar a translate() utiliza un objeto p5.Vector para establecer la cantidad de desplazamiento. Por ejemplo, llamar a translate(myVector) utiliza el x-, y- y z- componentes de myVector para establecer la cantidad de desplazamiento a lo largo del x-, y- y z-ejes. Hacer esto es lo mismo que llamar a translate(myVector.x, myVector.y, myVector.z).

De forma predeterminada, las transformaciones se acumulan. Por ejemplo, llamar a translate(10, 0) dos veces tiene el mismo efecto que llamar a translate(20, 0) una vez. Las funciones push() y pop() se pueden utilizar para aislar transformaciones dentro de grupos de dibujo distintos.

Nota: Las transformaciones se restablecen al principio del bucle de dibujo. Llamar a translate(10, 0) dentro de la función draw() no hará que las formas se muevan continuamente.