javascript - 如何在 NodeJS 中将整数数组映射到颜色阴影？

Question

将整数数组映射到颜色范围的最佳方法是什么？我有一个数组:

计数 = [ '290', '11', '8', '8', '6', '6', '3', '3', '3', '3' ]

我想映射到范围从 rgb(255, 0, 0) 到 rgb(255, 255, 255) 的红色阴影。

目前我只是使用 here 中的这个函数将数组中的整数映射到 0-255 :

const 比例 = (num, in_min, in_max, out_min, out_max) => {
返回 (num - in_min) * (out_max - out_min)/(in_max - in_min) + out_min;
}

var count = [ '290', '11', '8', '8', '6', '6', '3', '3', '3', '3' ]
var count_last = count[count.length - 1];
var count_first = count[0];
var new_count  = []
count.forEach(function(entry) {
  new_count.push(Math.round(scale(entry, count_last, count_first, 255, 0)))
})`

输出:

[ 0, 248, 251, 251, 252, 252, 255, 255, 255, 255 ]

这是可行的，但在这个例子中，值 290 将是红色的，所有其他值几乎是白色的，所以你无法区分它们，尽管 11 例如比 3 大得多。是否有其他方法可以动态地使用将整数映射到红色阴影，还是必须对颜色发生变化的阈值进行硬编码？

Answer 1

如果我理解正确，您对一个数字范围到其他数字范围的线性映射感兴趣。从数学上来说，您对 bijective function from [a,b] to [c,d] 感兴趣.

您想使用它来 map a range of integers (这意味着您知道输入的范围)转换为红色阴影，其中红色范围在 [0,255] 范围内(256 种红色阴影，这是输出的范围)

因此，假设您的输入范围(基于 count 数组中的最小值和最大值)为 [3,290]，输出范围为 [0,255]，那么当您输入如果从输入到映射函数的值 3，它应该返回 0。对于输入中的值 290 也是如此，该值在输出中映射到 255。因此，如果 M(x) 是映射函数，我们有:

M(3) = 0
M(290) = 255

我们手头有 2 点 (3,0) 和 (290,255)。通过 euclidean geometry :任何两个不同的点，都有一条包含它们的唯一线；情节是通过实现的

f(x) = f'(x)(x-x_0) + y_0

哪里

f'(x) = (y_1 - y_2) / (x_1 - x_2)

就你的情况而言，是

M(x) = (255 - 0) / (290 - 3) * (x - 3) + 0

其中 x 属于您输入的 Ranger，在本例中为 [3,290]

请注意，如果两个范围大小不同，则根据映射的量化，某些值可能会重叠。