压缩像素集的图像色彩空间答案

【问题标题】：compress image color space of set of pixels压缩像素集的图像色彩空间
【发布时间】：2018-09-20 19:47:29
【问题描述】：

我的情况是我收到了上传的图像，将其大小调整为小于 100 x 100，并提取了每个像素的颜色。因此，我所有关于压缩图像的数据都可以存储在四个变量中：

width - (int) 图片的整体宽度

height - (int) 图片的整体高度

colors - (Array) 具有唯一 RGB 值的对象数组

pixels - (Array) 二维数组，索引引用colors

对于我的实现，我想将颜色空间压缩到 20 种以下的独特颜色。我应该使用什么样的算法来融合和减少像素表达的独特颜色的数量？

我没有这方面的伪代码，但我认为必须有某种方法可以找出 20 种最不同的颜色（使用平均值中 R、G 和 B 值的最大方差）。然后，我将能够将其他颜色分组到与它们差异最小的其他颜色之一下，并平均每个组收到的值。但是，我不知道如何实现这一点，并对这种方法的有效性持怀疑态度。

想法？

【问题讨论】：

听起来很简单，您只需要弄清楚如何从两个不同的 RGB 对象中获取色差幅度（如果这确实是您确定想要的方法）。
问题是我可以有多达 10,000 种颜色，这可能是 5000 万种不同的颜色来组织。
您要查找的内容称为color quantization。这是一个研究得很好的领域。我使用八叉树算法从 16 位颜色（65536 色）到 256 色。 Wikipedia 文章可以帮助您入门，并且有很多可用的源代码示例。另见stackoverflow.com/q/6205955/56778
注意：您的colors 通常被称为“color_table”或“palette”。但我建议你遵循 BMP 格式的想法（它们也支持 16 位）：保留 [x][y] 数组，但只是为了占用预期的位，而不是与字节对齐 [但是，16 或 32 色更好：base 2]

【解决方案1】：

我同意吉姆·米歇尔的观点。您需要 JavaScript 库进行颜色量化。

颜色量化是用数千个图像缩小图像的过程或数百万种颜色变为一种颜色（通常为 256 种）。

您可以使用RgbQuant.js 并在选项中设置所需的颜色编号。

// options
var opts = {
    colors: 256, // desired palette size
    //...
};

你可以在实现之前看到这个demo。

【讨论】：

【解决方案2】：

在输入颜色和输出颜色之间的 L2 范数最小化方面，K-NN 聚类到 20 个集群将是最佳的

【讨论】：