javascript 获取图片主颜色

[luminqi]

Palette

github

[IOriens]

那我也推荐一下自己做的小程序好了，图片主色彩分析、色彩拾取、配色大全。


[IOriens]

[showecho]

这个确实不错，刚好用到

[TangMonk]

原理是遍历所有的像素点，然后找到最多出现的几个像素吗？

[RingoTC]

@TangMonk 他是取平均值，如果是求像素色值的众数，那么如果有一个纯色渐变的图像（每个像素点的色值各不相同），然后在这个图像中随机增加几个同色的像素点。但是整个图像的主颜色不应该是那些同色像素点的颜色。

[luminqi]

@TangMonk
首先像素的 rgb 值有 256*256*256 种可能，所以如果直接遍历然后统计相同的 rgb 值是不靠谱的。
这里其实会涉及到色彩量化(color quantization)。比较常见的算法有 Median cut, Octree, KMeans。
我并没有采用常规的方案，我的想法是如果能先把各个像素按照其颜色相近度排序，这样相似的颜色就会靠在一起，形成一条连续的色带。那么剩余的工作就很简单了，就是把这条色带切成一块一块，每一块代表一种颜色，每一块的颜色是它里面所有像素 rgb 值的平均值。比较可惜的是其实并不能完全对颜色排序，这里我采用色调(hue)进行排序并不完美。
你提出的算法我也想过，我觉得可以先对每个像素的 r 值，g 值，b 值向右位移(>>)3 位（或者更多），这样可以减少出现不同 rgb 值的概率。然后用一个 hash map 统计相同的 rgb 值。

[sincw]

学习了，赞一个