沿X轴镜像

Question

我必须创建SPA前端，在其中必须上传图像并为其创建缩略图，还必须创建沿x轴镜像的图像的新版本。 我不明白这意味着什么，以及如何使用react来实现。

任何人都可以帮助我理解它以及它的外观吗？

Answer 1

您可以使用画布执行此操作：

const canvas = document.getElementById('canvas')
const ctx = canvas.getContext('2d')
const image = new Image()

image.src = 'https://via.placeholder.com/200/200'
image.addEventListener('load', () => {
  ctx.translate(200, 0)
  ctx.scale(-1, 1)
  ctx.drawImage(image, 0, 0)
})

<canvas id="canvas" width="200" height="200"></canvas>