javascript - 如何创建具有特定渐变分布的 HTML 颜色数组？

Question

JavaScript。我有一组数字var 值 = [1,20,12,6,9];

我需要创建一个相同大小的新数组，这样:

1. 第一个最大元素对应的元素数组总是 "#3E296B"
2. 对应的元素第一个数组的最小元素始终是 "#FFFFFF"。
3. 其他元素应该得到 "#3E296B" 渐变颜色到 "#FFFFFF" 与其值成比例

即我的新数组应该大致如下:var colors = [white, blue, less_blue, less_less_blue, less_blue](我用文字来简化)

Answer 1

这是一个解决这个问题的库:

https://github.com/anomal/RainbowVis-JS

所以在包含它之后你会做类似的事情:

var rainbow = new Rainbow();
rainbow.setSpectrum('#ffffff', '#3E296B');
rainbow.setNumberRange(1, 20); 
rainbow.colourAt(number); // based on the numbers from your array, this would return the color you want