颜色转换

本文主要为实现RGB颜色的高亮，采用RGB转为YUV，增加亮度，再将颜色转为RGB的方式实现高亮。

RGB

RGB色彩模式是工业界的一种颜色标准，是通过对红(R)、绿(G)、蓝(B)三个颜色通道的变化以及它们相互之间的叠加来得到各式各样的颜色的，RGB即是代表红、绿、蓝三个通道的颜色;但是不容易表示统一色阶亮度的变化

YUV

YUV的原理是把亮度与色度分离，研究证明,人眼对亮度的敏感超过色度。。YUV三个字母中，其中”Y”表示明亮度，可用该属性实现颜色亮度的增加

高亮原理

• 将rgb颜色转为yuv颜色
• 增加y的值实现亮度的增加
• 将结果转回rgb

转换公式

• rgb -> yuv

    Y = (77*R + 150*G + 29*B)>>8;
    U = ((-44*R  - 87*G  + 131*B)>>8) + 128;
    V = ((131*R - 110*G - 21*B)>>8) + 128 ;

• yuv -> rgb

    R= Y + ((360 * (V - 128))>>8) ; 
    G= Y - (( ( 88 * (U - 128)  + 184 * (V - 128)) )>>8) ; 
    B= Y +((455 * (U - 128))>>8) ;

代码实现

colorStr为rgb颜色 colorUp为需要提高的亮度

function rgbaToYUV(colorStr,colorUp){
	var R,G,B,A,Y,U,V,colorArr,reusultColor;
	colorArr = colorStr.substring((colorStr.indexOf('(')+1),(colorStr.indexOf(')'))).split(',');//截取rbg三个值
	R = colorArr[0],
	G = colorArr[1],
	B = colorArr[2],
	A = colorArr[3];
	Y = (77*R + 150*G + 29*B)>>8;
	U = ((-44*R  - 87*G  + 131*B)>>8) + 128;
	V = ((131*R - 110*G - 21*B)>>8) + 128 ;
	return YUVToRgba(Y,U,V,A,colorUp);
}
function YUVToRgba(Y,U,V,A,addValue){
	var R,G,B;
	Y = Y + addValue;//增加亮度
	R= Y + ((360 * (V - 128))>>8) ; 
	G= Y - (( ( 88 * (U - 128)  + 184 * (V - 128)) )>>8) ; 
	B= Y +((455 * (U - 128))>>8) ;
    return 'rgba('+R+','+G+','+B+','+A+')';
}