首页 文章

JavaScript中的颜色量化/缩小图像调色板的算法? [关闭]

提问于
浏览
19

我正在编写一个Web应用程序,它采用用户提交的图像,通过 canvas 元素获取像素数据,进行一些处理,然后使用矢量形状(使用Protovis)渲染图像 . 它希望让用户选择目标调色板大小并将调色板缩小到该大小 .

在我想减少色彩空间的地方,我正在使用RGB像素数据数组,如下所示:

[[190,197,190], [202,204,200], [207,214,210], [211,214,211], [205,207,207], ...]

我尝试了从颜色中删除最低有效位的天真选项,但结果非常糟糕 . 我已经对color quantization算法做了一些研究,但还没有找到如何实现算法的清晰描述 . 我可能会想出一种方法将它发送到服务器,通过图像处理程序运行它,然后发回生成的调色板,但我更喜欢在客户端使用JavaScript .

有没有人有一个明确解释的算法的例子可以在这里工作?目标是将几千种颜色的调色板减少到针对该特定图像优化的较小调色板 .

Edit (7/25/11): 我在JavaScript中使用了@Pointy 's suggestion and implemented (most of) Leptonica'的MMCQ(修改后的中值切割量化) . 如果你有兴趣,你可以see the code here.

Edit (8/5/11): clusterfck library看起来是另一个很好的选择(尽管我认为它比我的实现慢一点) .

2 回答

  • 5

    随着警告我不要't claim any expertise at all in any field of image processing: I read over the Wikipedia article you linked, and from there found Dan Bloomberg' s Leptonica . 从那里你可以download讨论和解释算法的来源 .

    源代码在C中,希望它足够接近JavaScript(至少在核心“公式”部分中)是可以理解的 . “MMCQ”算法背后的基本思想似乎并不复杂 . 它实际上只是一些启发式技巧,可以根据图像中的颜色聚集在一起将三维颜色空间分割成子立方体 .

  • 9

    我写了一个网络应用程序,从图像中提取调色板 . 它允许您加载图像,然后使用三种不同的算法/方法来从中提取调色板:

    • Simple histogramming

    • Median Cut

    • k-means

    你可以找到一个运行here的副本

    你可以在github找到它的代码

    它在Javascript中100%编写,并使用Plotly.js作为示例图 .

    我还写了一篇文章更详细地描述了三种方法/算法 - 你可以找到here

相关问题