Flip & Mirror Error

[cagdastakis]

I do some maths but couldnt figured out. I want to draw 2 images. First one is perfect with perspective as i wanted but second should be flipped or mirrored. When i change the coordinates for flipped image disappear or broken pixels. Anyone have a solution for this? Mirrored and perspective :S

[flozz]

Hello,

perspective.js does not work when flipping points. But you can mirror your image using the scale() method of the 2D context before drawing your image:

const ctx = canvas.getContext("2d");
ctx.save();
ctx.scale(-1, 1);  // Horizontal flip
// here draw your deformed image (ctx.drawImage...)
ctx.restore()

More: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/scale#flipping_things_horizontally_or_vertically