javascript - 将图像转换为黑白的最佳 RGB 组合 "threshold"

Question

我需要构建一个简单的应用程序，将彩色图像或灰度图像转换为黑白图像，我正在考虑循环遍历每个像素并检查 RGB 值，以及它们是否都小于特定值(假设20) 将像素重绘为黑色，如果大于该值，则将像素重绘为白色。像这样的东西。

function blackWhite(context, canvas) {
    var imgData = context.getImageData(0, 0, canvas.width, canvas.height);
        var pixels  = imgData.data;
        for (var i = 0, n = pixels.length; i < n; i += 4) {
        if (pixels[i] <= 20 || pixels[i+1] <= 20 || pixels[i+2] <= 20){ 
              pixels[i  ] = 0;        // red
           pixels[i+1] = 0;        // green
           pixels[i+2] = 0;        // blue
        }else{
              pixels[i  ] = 255;        // red
           pixels[i+1] = 255;        // green
           pixels[i+2] = 255;        // blue
        }
    }
    //redraw the image in black & white
    context.putImageData(imgData, 0, 0);
  }

最大的问题是，将像素定义为黑色的红色、绿色和蓝色的正确组合是什么，考虑到人眼对颜色的感知不同，以我们的眼睛为例，绿色更重要颜色比红色和蓝色，我已经通过实验尝试了一些值，但我没有接近黑色，并且图像不像你可以通过将扫描仪中的一张纸数字化为黑白来获得的图像。

当然，如果有更快的方法来做到这一点，我将不胜感激。

Answer 1

我相信您正在寻找的是相对亮度。虽然不是最先进的阈值方法，但它更好地遵循人类感知光的方式，这就是我认为你想要的。

https://en.wikipedia.org/wiki/Relative_luminance

从维基百科文章中，亮度可以计算如下:
let lum = .2126 * red + .7152 * green + .0722 * blue
该值将是 1 的一部分，因此如果您想在中间拆分它，请使用 0.5 的阈值

编辑

真正的问题在于选择阈值。并非所有图像都以相同的方式点亮，具有更多像素且低亮度(即更多黑色)的图像将受益于较低的阈值。
您可以考虑使用几种技术，例如分析图像的直方图。