RGB值随数组值而变化？

Question

我有一个项目我正在使用d3js。我必须绘制一条线。但是扭曲是线的颜色会随着每个数组值而变化（每行20px的行包含以下数组的一个元素）。我有但是，我遇到了颜色强度的问题。我想到了循环，但我没有得到确切的结果。我想我无法从一种颜色转换到另一种颜色。

（例如 - 从昏暗的红色 - >浅红色 - >浅红色 - >深红色

我有一个超过10k值的json。为了理解目的，我简化了我的数组。

var array_1 = [0.0,0.1,0.3,0.5,0.7,0.9]

var array_2 = [0.02,0.04,0.06,0.08,0.09]

var array_3 = [0.001,0.002,0.004,0.007,0.008]

MyQuestion ：对于任何给定的颜色（红色，蓝色，绿色，黄色等），我应该能够根据这些数组值绘制更大的号码将是，强烈的颜色。

是否有可能创建一个算法，可以使用数值的数组值来处理任何颜色的RGB值？如果可能的话，你可以提供一些样本。

Answer 1

您需要从YCbCr（YUV）转换为RGB YUV中的Y是发光，它改变了颜色的强度。

这些公式可以在维基百科上找到： http://en.wikipedia.org/wiki/YCbCr

此处还有一个在JavaScript中实现的示例： http://www.mikekohn.net/file_formats/yuv_rgb_converter.php

例如，在Micael Kohn的页面上，您可以尝试设置RGB颜色 并将其转换为YUV。之后只需降低或提高Y值即可 将其转换为RGB。你会注意到它就像改变了 强度。

修改

在这里，给你写一个例子，只需点击div

即可

function yuv2rgb(Y,U,V){
    R = Y + 1.4075 * (V - 128)
    G = Y - 0.3455 * (U - 128) - (0.7169 * (V - 128))
    B = Y + 1.7790 * (U - 128)
    return { r:Math.floor(R) , g:Math.floor(G) , b:Math.floor(B)}
}

function rgb2yuv(R,G,B){
    Y = R *  0.299000 + G *  0.587000 + B *  0.114000
    U = R * -0.168736 + G * -0.331264 + B *  0.500000 + 128
    V = R *  0.500000 + G * -0.418688 + B * -.081312 + 128
    return { y:Math.floor(Y) , u:Math.floor(U) , v:Math.floor(V)}
}

http://jsfiddle.net/b3FCK/