Javascript RGB值随阵列值变化？

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

（例如，从暗红色-->浅红色-->小深红-->深红色）

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

var数组_1=[0.0,0.1,0.3,0.5,0.7,0.9]

变量数组_2=[0.02,0.04,0.06,0.08,0.09]

变量数组_3=[0.001,0.002,0.004,0.007,0.008]

MyQuestion：对于任何给定的颜色（红色、蓝色、绿色、黄色等），我应该能够根据这些数组值以这样的方式绘制图像：数字越大，颜色越浓

---

有没有可能创建一种算法，可以使用数字数组值来处理任何颜色的RGB值？如果可能，请提供一些示例。您只需从YCbCr（YUV）转换为RGB即可 YUV中的Y是发光的，它改变了颜色的强度

这些公式可以在维基百科上找到：

这里还有一个用JavaScript实现的示例：

例如，在Michael Kohn的页面上，您可以尝试在RGB中设置颜色 把它藏起来给你。之后，只需降低或提高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)}
}

---

我们将RGB值转换为，根据您的值增加强度分量，然后将结果转换回RGB。@Esailija:您能给我一些链接或信息吗？下面给出的答案不多helpful@MESSIAH在我的回答中添加了一个示例，如果这不是你想要的，我会尝试另一种颜色转换，你从哪里得到这些值（128，0.29900等等）。这是某种公式吗？是的，如果你读了那篇文章，他会给你一个公式链接。这个公式也在matrix formI的wiki上，我试图搜索RGB和YUV之间的差异，但我对它仍然有点含糊不清。为什么需要转换，RGB值是否可以直接从一种颜色切换到更亮或更暗的颜色？问题是，如果要在RGB中获得更亮或更暗的颜色，必须修改与所有其他值相关的每个值。例如红色（150,0,0）您可以使用god+（10,0,0）-（10,0,0）来更改此颜色，但对于灰色（150150）您应该使用+（10,10,10）-（10,10,10）。因此，例如改变R值与R G和B成正比，这就是为什么你无论如何都需要YUV公式：我尝试改变rgb，问题是当我改变参数时，我完全改变了颜色！！！YUV将把我保留在一个特定的领域。（即仅红色的变化）谢谢你的回答！！！