计算公式

[ W x W y W z ] = [ M ] [ R G B ] \begin{gather} \begin{bmatrix} W_x\\ W_y\\W_z \end{bmatrix}= \begin{bmatrix} M \end{bmatrix} \begin{bmatrix} R\\G\\B \end{bmatrix} \end{gather} WxWyWz =[M] RGB
其中， W x = w x / w y , W y = w y / w y , W z = w z / w y , w x 、 w y 、 w z W_x = w_x/w_y,W_y = w_y/w_y,W_z = w_z/w_y,w_x、w_y、w_z Wx=wx/wy,Wy=wy/wy,Wz=wz/wy,wx、wy、wz为目标混色光色坐标， [ R G B ] \begin{bmatrix} R\\G\\B \end{bmatrix} RGB 分别为红绿蓝对应的亮度配比，
[ M ] = [ X r X g X b Y r Y g Y b Z r Z g Z b ] \begin{gather} \begin{bmatrix} M \end{bmatrix}= \begin{bmatrix} X_r&X_g&X_b\\ Y_r&Y_g&Y_b\\ Z_r&Z_g&Z_b\\ \end{bmatrix} \end{gather} [M]= XrYrZrXgYgZgXbYbZb
R x = r x / r y R y = 1 R z = ( 1 − r x − r y ) / r y G x = g x / g y G y = 1 G y = ( 1 − g x − g y ) / g y B x = b x / b y B y = 1 B z = ( 1 − b x − b y ) / b y \begin{gather} R_x= r_x/r_y \\ R_y= 1 \\ R_z = (1-r_x-r_y)/r_y\\ G_x= g_x/g_y \\ G_y= 1 \\ G_y = (1-g_x-g_y)/g_y\\ B_x = b_x/b_y \\ B_y = 1 \\ B_z = (1-b_x-b_y)/b_y\\ \end{gather} Rx=rx/ryRy=1Rz=(1−rx−ry)/ryGx=gx/gyGy=1Gy=(1−gx−gy)/gyBx=bx/byBy=1Bz=(1−bx−by)/by
其中 ( r x , r y ) , ( g x , g y ) , ( b x , b y ) (r_x,r_y),(g_x,g_y),(b_x,b_y) (rx,ry),(gx,gy),(bx,by)分别为红绿蓝三色的单色色坐标。

html源码

<!DOCTYPE html>
<html>
<head><title>Calculation Matrix</title><link rel="stylesheet" href="style.css">
<script type="text/javascript" src="math.js"></script>
<script type="text/javascript">
function XYZ2RGB(){var x_r,y_r,x_g,y_g,x_b,y_b,X_W,Y_W,Z_W,White_CIEx,White_CIEy,White_CIEz;x_r = Number(document.getElementById("Red_CIEx").value);y_r = Number(document.getElementById("Red_CIEy").value);x_g = Number(document.getElementById("Green_CIEx").value);y_g = Number(document.getElementById("Green_CIEy").value);x_b = Number(document.getElementById("Blue_CIEx").value);y_b = Number(document.getElementById("Blue_CIEy").value);White_CIEx = document.getElementById("White_CIEx").value;White_CIEy = document.getElementById("White_CIEy").value;White_CIEz = 1-White_CIEx-White_CIEy;X_W = White_CIEx/White_CIEy;Y_W = White_CIEy/White_CIEy;Z_W = White_CIEz/White_CIEy;M = Creat_TranMatrix(x_r,y_r,x_g,y_g,x_b,y_b);const White_XYZ = math.matrix([X_W, Y_W, Z_W]);var RGB_ratio = math.matrix();RGB_ratio = math.multiply(M,White_XYZ);const RGB_ratio_array = RGB_ratio.valueOf();document.getElementById('Red').value=RGB_ratio_array[0].toFixed(4);document.getElementById('Green').value=RGB_ratio_array[1].toFixed(4);document.getElementById('Blue').value=RGB_ratio_array[2].toFixed(4);
}
function Creat_TranMatrix(x_r,y_r,x_g,y_g,x_b,y_b){X_r = x_r/y_r;Y_r = 1;Z_r = (1-x_r-y_r)/y_r;X_g = x_g/y_g;Y_g = 1;Z_g = (1-x_g-y_g)/y_g;X_b = x_b/y_b;Y_b = 1;Z_b = (1-x_b-y_b)/y_b;const X_rgb = math.matrix([[X_r, X_g, X_b], [Y_r, Y_g, Y_b],[Z_r, Z_g, Z_b]]);return math.inv(X_rgb);
}
</script>
</head>
<body><!-- 显示结果信息 --><div id = "ResultTable"><table align = "left" border = "1" cellpadding = "20"><tr>   <th>Color</th><th>CIEx</th><th>CIEy</th><th>ratio</th></tr><tr> <td>White</td><td><input id = "White_CIEx" border:none type = "TEXT" value = "0.305"/></td><td><input id = "White_CIEy" border:none type = "TEXT" value = "0.310"/></td><td>-</td></tr><tr>   <td>Red</td>  <td><input id = "Red_CIEx" border:none type = "TEXT" value = "0.64"/></td><td><input id = "Red_CIEy" border:none type = "TEXT" value = "0.33"/></td><td><input id = "Red" border:none type = "TEXT" value = "0.42"/></td></tr><tr>   <td>Green</td><td><input id = "Green_CIEx" border:none type = "TEXT" value = "0.30"/></td><td><input id = "Green_CIEy" border:none type = "TEXT" value = "0.6"/></td> <td><input id = "Green" border:none type = "TEXT" value = "0.36"/></td></tr><tr> <td>Blue</td> <td><input id = "Blue_CIEx" border:none type = "TEXT" value = "0.15"/></td><td><input id = "Blue_CIEy" border:none type = "TEXT" value = "0.08"/></td><td><input id = "Blue" border:none type = "TEXT" value = "0.22"/></td></tr></table></div><div><ul><li onclick="XYZ2RGB()"><a href="#">XYZ2RGB</a></li></ul></div>
</body>
</html>

运行结果

屏幕色彩(一)-已知混色光色点求配色比相关推荐

转已知两点坐标和半径求圆心坐标程序C++
数学思想:利用圆方程和直线方程已知两点坐标和半径求圆心坐标程序 #include <iostream> #include <fstream> #include <cma ...
python求平行四边形面积_python 已知平行四边形三个点,求第四个点的案例
我就废话不多说了,大家还是直接看代码吧! import numpy as np #已知平行四边形三个点,求第四个点 #计算两点之间的距离 def CalcEuclideanDistance(point ...
天文观测理论——已知像素大小、焦距，求像素分辨率
一.已知像素大小.焦距,求像素分辨率 1. 计算像素分辨率为 Pix, 单位:角秒/像素像素大小为 d2d^2d2, 单位:平方毫米焦距为 fff, 单位:毫米总像素为 rerere, 单位: ...
【目标检测】已知top, left, bottom, right 求 xmin,ymin,xmax,ymax
前段时间在项目实践过程中遇到xmin,ymin,width,height 和 xmin,ymin,xmax,ymax相互转换的问题,请看https://blog.csdn.net/AugustMe/a ...
JAVA已知圆心经纬度和半径求圆周点的经纬度
JAVA已知圆心经纬度和半径求圆周点的经纬度项目中遇到一个需求,需要根据传入的圆心经纬度和半径参数获得圆周点的经纬度,在网上查询了很多没有找到能用的算法,从GPT中获取到了一个简洁的用java实现的 ...
已知随机变量X的协方差矩阵求去X的特征值特征向量 PCA投影矩阵
已知随机变量X的协方差矩阵求去X的特征值特征向量 PCA投影矩阵相关的知识都忘记了,去查的时候没有耐心看别人长篇大论讲解,就只简单记录了一下如果从协方差矩阵来计算特征值和特征向量. 定义:1.特征 ...
已知三角形三边长求面积java_已知三角形三点坐标求三角形面积.java
已知三角形三点坐标求三角形面积主程序代码如下: import java.util.*; public class Tringle { public static void main(String[] ...
js 已知角度和斜边，求直角边
//已知角度和斜边,求直角边 function hypotenuse(long,angle){//获得弧度var radian = 2*Math.PI/360*angle;return {a:Math ...
python写的平行四边形_python 已知平行四边形三个点,求第四个点的案例
我就废话不多说了,大家还是直接看代码吧! import numpy as np #已知平行四边形三个点,求第四个点 #计算两点之间的距离 def CalcEuclideanDistance(point ...

屏幕色彩(一)-已知混色光色点求配色比

文章目录

计算公式

html源码

运行结果

屏幕色彩(一)-已知混色光色点求配色比相关推荐

最新文章

热门文章