javascript - 在 JavaScript 中将一系列值(例如 [0,255])映射到一系列颜色(例如彩虹 : [red, 蓝色])

Question

我敢肯定这一定是一个相当简单的问题，但这是一个很难用语言表达的问题。我什至不知道要用谷歌搜索什么。

我不是在寻找任何复杂的解决方案。基本上，我在 Canvas 上画线，我想要根据线的长度使用不同的颜色。通常我只是缩放红色 channel (#ff0000 *(线长)/(最大线长))，但这个解决方案并不理想。我只是在寻找一个方程式，它可以为彩虹渐变上的某个位置提供#rrggbb 值(如果有意义的话)。

感谢任何可以提供帮助的人!非常感谢。

Answer 1

既然您使用的是 Canvas ，那么您可能可以使用 HSL 颜色空间(如果我错了请纠正我)。这将使代码更简单:

function rainbow(n) {
    n = n * 240 / 255;
    return 'hsl(' + n + ',100%,50%)';
}

如果您可以接受 0 到 240 之间的范围，那么您甚至可以删除此函数的第一行。参见 DEMO .