画布矩形填充颜色

【问题标题】：Canvas rectangle fill with colour画布矩形填充颜色
【发布时间】：2017-02-26 22:08:21
【问题描述】：

我试图在 html 5 画布中创建一个矩形，我可以为其提供从最小值到最大值的值。为此，我正在考虑创建一个渐变变量，例如

  defaultGradient: {
        0.4: 'blue',
        0.6: 'cyan',
        0.7: 'lime',
        0.8: 'yellow',
        1.0: 'red'
    }

例如，用户输入值 50，因此应用程序应选择蓝色和青色的中间并填充矩形。帮助表示赞赏。我经历过不同的 SO 链接，但对我没有用

【问题讨论】：

【解决方案1】：

为此，您可以使用 RGB。例如青色的 RGB (r1, g1, b1) ...

青色：rgb(r1, g1, b1)

蓝色：rgb(r2, g2, b2)

当用户输入 50 时，您需要计算这些之间的颜色：

  resultColor = rgb((r1+r2)/2 , (g1+g2)/2, (b1+b2)/2)

如果用户输入 41：

 resultColor = rgb(((19 * r1)+r2)/20 , ((19*g1)+g2)/20, ((19*b1)+b2)/20)

【讨论】：