canvas实现图像垂直翻转

假设这有一张养眼图片,它长这样

接着我想把照片垂直翻转一下,变成这样

翻转后体验了一把倒立的美女. 经过对比,垂直翻转后,上边和下边都互换了过来,也就是说,上边的像素根据垂直中轴对称和下边的像素进行了互换操作,垂直翻转的关键点就是每一列的上下像素根据轴对称,确实很简单,以下是实现的步骤

1.获取画布上图像的像素信息

2.遍历总行数一半的每一行作为外循环(向下取整)

3.遍历当前行的列作为内循环,把列的每个通道按照水平轴对称和镜像里的通道互换

4.把处理后的像素信息放回画布

现在知道怎么做了,继续

function Filter(context){
   
  this.context = context;
}
Filter.prototype.constructor = Filter;
Filter.prototype.flipVertical = function(startX, startY, w, h){
   
  // 1.获取图像信息
  let imgdata = this.context.getImageData(startX