根据整数值查找颜色-快速算法

Question

我构建了一些应用程序，它是计算颜色梯度依赖于一些值。我使用d3.js来计算颜色，但我发现这个函数真的很慢-它在80ms内执行(40000次是这个函数执行)。这对我来说太大了(我用了很多次)

var findColor = d3.scaleLinear().domain([0,10,20,30,40,50,60,70,80,90,100,110]).range(['#a50026 ','#d73027 ','#f46d43 ','#fdae61 ','#fee08b ','#ffffbf ','#d9ef8b ','#a6d96a ','#66bd63 ','#1a9850 ','#006837 ','#006837 ']);

你能告诉我什么是更好的解决方案吗?我需要更快的主意。

50箱的开关会更好更快吗?

Answer 1

好吧，不要以为一台使用现代浏览器的普通电脑会花80毫秒来完成这个功能。

这是而不是答案(从某种意义上说，我没有提供任何更快的替代方案)，但我必须将其作为答案写下来，因为我想使用代码片段(我不能在注释中使用)向您展示这个函数有多快:

在下面的代码片段中，这个函数执行了10000次。在我(相当旧的)装有Chrome浏览器的电脑上，运行所有循环需要21毫秒。点击"运行代码段"查看。

var t1 = performance.now()
var findColor = d3.scaleLinear()
    .domain([0,10,20,30,40,50,60,70,80,90,100,110])
    .range(['#a50026 ','#d73027 ','#f46d43 ','#fdae61 ','#fee08b ','#ffffbf ','#d9ef8b ','#a6d96a ','#66bd63 ','#1a9850 ','#006837 ','#006837 ']);
for(var i = 0; i < 10000; i++){
findColor(Math.random()*110)
}
var t2 = performance.now()
console.log("Time: " + (t2 - t1) + " miliseconds");

<script src="https://d3js.org/d3.v4.min.js"></script>

注: OP编辑问题，解释80ms指40000次。这与上述代码段循环40000次的性能大致相同。