Otra posibilidad interesante que ofrece HTML5 es la posibilidad de aplicar una transformación de espejo a un elemento, aplicando una escala negativa en el eje X para espejar el elemento en el plano horizontal.
También podemos aplicar una escala negativa en el eje Y para reflejar el elemento de manera vertical. Veamos un ejemplo de código para comprender mejor este método:
<canvas id=”reflejo” width=”578” height=”200”></ canvas>
<script>
var canvas = document.getElementById(‘reflejo’);
var context = canvas.getContext(‘2d’);
context.translate(canvas.width / 2, canvas.height / 2);
// aplicar reflejo horizontal context.scale(-1, 1);
// aplicar estilo de texto context.font = ‘30pt Calibri’;
context.textAlign = ‘center’;
context.fillStyle = ‘blue’;
context.fillText(‘Hola Mundo de users!’, 0, 0);
</script>
</body>
