如何量化一张图片的色彩关系？
如何量化一张图片的色彩关系？
↑ 点击加入mixlab社区
15000+跨学科人群，机器学习、机器视觉、自然语言处理、知识图谱、量化交易、物联网、区块链、产品经理、交互设计、建筑设计、服装设计、珠宝设计、平面设计、音乐、艺术等。
上一期讲到Brandmark提出了一种表达色彩比例及关系的数据结构，无向色彩节点图，见下图：
本文详细介绍这一表达方式，及相关的实现代码。
阅读难度：★★★☆☆
技能要求：JS基础、数学基础
字数：800字
阅读时长：4分钟
我们先了解下何为Color quantization？
中文为色彩量化（点击查看详情介绍）。
色彩量化简单来说，就是压缩颜色，使颜色可以量化的一种方法。这听起来是不是类似于之前介绍过的MCCQ算法？没错，MCCQ就是色彩量化中的一种算法。Brandmark采用的色彩量化库是RgbQuant.js库，然后通过图（无向色彩节点图）的方式表达。通过以下几步：
STEP1
量化图片
通过RgbQuant.js库来获取图片的色彩量化结果，这里示例获取的是3个色彩数据来压缩图片。
quantized = colorgraph.quantize(img,num,use_mode)获得结果，包括压缩色彩后的图片及色板。
STEP2
获取色彩矩阵
（无向色彩节点图的数学表示）
adjacency = colorgraph.get_connectivity_matrix(quantized.palette, quantized.canvas, normalize)思考下如何用计算机语言表示图？如下图：
节点跟节点之间连线的称之为“图”。
答案点击查看
计算邻接矩阵：
STEP2.1
初始化邻接矩阵
STEP2.2
遍历量化后的图片
STEP2.3
更新邻接矩阵
上图的过程，我们用文字描述一下：
一次获取4个像素点，然后获取4个像素点在色板中的位置（编号），如果任意2个像素之间的颜色不相等，则这两个节点之间接近程度+1，对应更新邻接矩阵中对应的元素数值。
代码：
for (var x=0; x<canvas.width-1; x++){
for (var y=0; y<canvas.height-1; y++){
var p1 = pixel_at(pixels, canvas.width, x, y);
var p2 = pixel_at(pixels, canvas.width, x+1, y);
var p3 = pixel_at(pixels, canvas.width, x+1, y+1);
var p4 = pixel_at(pixels, canvas.width, x, y+1);
if(!pequal(p1, p2)){
conn[pindex(palette,p1)][pindex(palette,p2)] += 1;
conn[pindex(palette,p2)][pindex(palette,p1)] += 1;
console.log(conn.toString())
}
if(!pequal(p1, p3)){
conn[pindex(palette,p1)][pindex(palette,p3)] += 1;
conn[pindex(palette,p3)][pindex(palette,p1)] += 1;
}
if(!pequal(p1, p4)){
conn[pindex(palette,p1)][pindex(palette,p4)] += 1;
conn[pindex(palette,p4)][pindex(palette,p1)] += 1;
}
if(!pequal(p2, p3)){
conn[pindex(palette,p2)][pindex(palette,p3)] += 1;
conn[pindex(palette,p3)][pindex(palette,p2)] += 1;
}
if(!pequal(p2, p4)){
conn[pindex(palette,p2)][pindex(palette,p4)] += 1;
conn[pindex(palette,p4)][pindex(palette,p2)] += 1;
}
if(!pequal(p3, p4)){
conn[pindex(palette,p3)][pindex(palette,p4)] += 1;
conn[pindex(palette,p4)][pindex(palette,p3)] += 1;
}
}
};
STEP2.4
邻接矩阵归一化处理
通过归一化处理后，我们就得到这张图片的邻接矩阵啦，一张图片的色彩关系就被量化了。
一张图片的色彩关系如何真正被机器所读懂的方法。
以上为全文。
近期活动推荐：
快！TensorFlow、黑客马拉松、DevFest千人大会 ，GDG DevFest 2018在召唤你
--------------------------------------
mixlab 无界社区 是一所面向未来的实验室，它提倡“跨界创新，开放成长”的理念。
——跨界 开放 互助 学习 思维 创新。
目前社区汇集了1500+跨学科人群，主要来自GoogleBrain、微软、华为、阿里鲁班、腾讯、旷视、三角兽、物灵科技、众安保险、美团、360等科技人才、设计师及CEO和投资人；高校分布MIT、Oxford、Cambridge、CMU、UoM、清华、上交大、同济等学生及教师群体；学科跨越机器学习、自然语言处理、量化交易、物联网、区块链、前端、后端、产品经理、UI设计、建筑设计、服装设计、珠宝设计、音乐、艺术等。
社区典型的用户技能为： ML00：小程序开发、AI+设计 ML04: 算法作曲 ML05：AI变脸 ML07：WebGL+Three.js数据可视化 ML14：增长黑客 ML16：机器学习 ML37：AR ML41：人工智能+音乐 ML44：珠宝设计+参数化设计 ML83：量化交易、数字货币交易 ML109：Arduino、processing ML113：人工智能+服装设计 ML206：VR/AR ML245：建筑设计智能化
详细介绍点击以下卡片：
mixlab期待您的加入！