Javascript图像主群集颜色 [英] Javascript image main cluster color

查看:159
本文介绍了Javascript图像主群集颜色的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在寻找一种方式通过javascript寻找图片的主要颜色。可能通过一些算法来聚类一些区域。

I'm looking for a way trough javascript find the main color from a image. Probably trough some algorithm to cluster some areas.

问题,因为如果我使用像素,将会使用更多的像素。例如,如果我有棕色和非常颜色旁边的棕色,然后一个部分与白色。主色可以是白色。并且不想要颜色平均,因为不能表示图像的真实颜色。

Problem because if I use pixel, will count more pixels used. Ex. if i have brown and very colors next to brown, then a part with white. the main color could be white. And not want color average because could not represent the real color of the image.

任何插件,代码实现,网站的建议。提前感谢

Any suggestion of plugins, code to implement, websites . Thanks in advance

UPDATE

这样:

http://www.cssdrive.com/imagepalette/

这里有一些解释,不知道我是否可以重用js代码。

There here something explaining, not sure if i can reuse the js code.

http:/ /harthur.wordpress.com/2009/12/18/getting-the-color-scheme-of-a-website-using-canvas-and-hierarchical-clustering/

推荐答案

这是艰难但可行的。

第一步是从图片中获取像素数据 - 为此,您需要将图像绘制到画布元素并获取像素数据。请注意,同源政策适用于图片,因此图片必须位于相同的服务器上

The first step is to get the pixel data from the image - in order to do this, you'll need to draw the image onto a canvas element and get the pixel data. Note that the Same Origin Policy applies to the image, so the image must be on the same server as the script or you'll need to use a proxy.

现在,您可以对像素数据应用算法来查找主颜色。最简单的选项是平均值,但它听起来像你不想要的。有很多聚类算法;可能您想要的是执行颜色量化,以将调色板中的颜色数量减少到一些小数字,然后取表示图像中最多像素的颜色。

Now you can apply an algorithm to the pixel data to find the "main" color. The easiest option is the average, but it sounds like you don't want that. There are a lot of clustering algorithms out there; probably what you want is to perform color quantization to reduce the number of colors in the palette to some small number, then take the color that represents the most pixels in an image.

中值裁剪算法是一个很好的,相对简单的选项,虽然它仍然是一个相当大的编码。我在一个小的爱好项目中使用Javascript来实现此算法 - 您可以在这里查看我的代码。它不会为你开箱即用,但我可能为你做了大部分的辛勤工作。

The median cut algorithm is a good, relatively simple option here, though it's still a fair amount of coding. I worked on a small hobby project to implement this algorithm in Javascript - you can see my code here. It won't work for you out of the box, but I've probably done most of the hard work for you.

这篇关于Javascript图像主群集颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆