Javascript 在一定范围内使用paper.js进行颜色转换

我有一个问题，想了一整天后需要解决。我想生成一个画布，通过使用一个范围来改变他的颜色。听起来很简单

颜色为（HSB）。有6种颜色

蓝色（230，S，B）

绿色（130，南，北）

黄色（55，S，B）

橙色（40，S，B）

红色（0（或360）、S、B）

维奥莱特（315，南，北）

饱和度和亮度不重要（可以始终相同）

颜色必须在此范围内更改

蓝色0-2.9绿色

绿色3-5.9黄色

黄色6-8.9橙色

橙色9-11.9红色

红色12-14.9紫罗兰色

所以如果我得到一些像这样的数据

var sample Data = new Array(0.1,0.2,0.3,0.4,3.4,5.9,9.3,9.4,9.5,9.6,...);

画布必须将色调从蓝色变为绿色，然后进行“颜色剪切”，因为“大跳跃”从0.4变为3.4（介于绿色和黄色之间）

我在寻找这个问题背后的“逻辑”。我已经有了画布的HTML。对于画布和颜色，我使用Paper.js

希望有人能理解我的问题

---

谢谢

我不知道Paper.js，所以我无法在画布上获得颜色，但我可以帮助将数据转换为颜色。因为你们的五种色调范围大小不一样，我们必须对每一种进行单独的计算

var sampleColors = [],
    l = sampleData.length,
    s = '50%',
    b = '50%';
function getColor(d) {
    var c, m = d % 3;
    if (d < 3) c = 230 - m * 33.333;
    else if (d < 6) c = 130 - m * 25;
    else if (d < 9) c = 55 - m * 5;
    else if (d < 12) c = 40 - m * 13.333;
    else c = 360 - m * 15;
    return 'hsb(' + Math.round(c) + 'deg,' + s + ',' + b + ')';
}

for(var i = 0; i < l; i++) {
    sampleColors.push(getColor(sampleData[i]));
}

---

如果颜色符号不符合您的需要，请发表评论。

您知道我的2个问题的答案吗？

sampleData[0] == 0.1;    sampleColor[0] == 'hsb(227deg,50%,50%)';
sampleData[4] == 3.4;    sampleColor[4] == 'hsb(120deg,50%,50%)';