How do you convert a color image to black/white using Javascript?

后端 未结 9 1410
梦如初夏
梦如初夏 2020-12-05 11:01

How do you convert a color image to black/white using only Javascript?

AND, also make it cross compatible in most browsers because I hear Internet E

9条回答
  •  悲&欢浪女
    2020-12-05 11:29

    Using HTML5 Canvas and JavaScript

     ctx.drawImage(img, 0, 0, w, h);
    
        var imgPixels = ctx.getImageData(0, 0, w, h);
        for(var y = 0; y < imgPixels.height; y++){
         for(var x = 0; x < imgPixels.width; x++){
              var i = (y * 4) * imgPixels.width + x * 4;
              var avg = (imgPixels.data[i] + imgPixels.data[i + 1] + imgPixels.data[i + 2]) / 3;
              imgPixels.data[i] = avg;
              imgPixels.data[i + 1] = avg;
              imgPixels.data[i + 2] = avg;
         }
    }
    ctx.putImageData(imgPixels, 0, 0, 0, 0, imgPixels.width, imgPixels.height);
    

提交回复
热议问题