Javascript颜色渐变均匀分割，蓝色到灰色到红色

使用javascript/D3，我试图将颜色映射到从红色到灰色再到蓝色的渐变色，如下所示

这是取自Algo-Vis论文的 幻灯片13。然而，我有困难产生这个梯度。我试过了 创建两个从蓝色到灰色和从灰色到红色的渐变，如下所示，但我的结果是关闭的

botRgb = d3.rgb(0,0,210);
topRgb = d3.rgb(210,0,0);
midRgb = d3.rgb(230,230,230);
gradient1 = d3.interpolateRgb(botRgb,midRgb);
gradient2 = d3.interpolateRgb(midRgb,topRgb);
// assume x is from 0 to 1
if (x < 0.5){
  return gradient1(x)
} else {
  return gradient2(x)
}

botRgb=d3.rgb（0,0210）；
topRgb=d3.rgb（210,0,0）；
midRgb=d3.rgb（230230）；
梯度1=d3.插值RGB（botRgb，midRgb）；
梯度2=d3.插值RGB（midRgb，topRgb）；
//假设x在0到1之间
如果（x<0.5）{
返回梯度1（x）
}否则{
返回梯度2（x）
}

任何帮助都将不胜感激，谢谢

您可能想看看。特别是，该功能允许创建一个域——在您的例子中，您说您的x是从0到1——并为该域分配范围内的等价项

比如：

var color = d3.scaleLinear()
    .domain([0, 0.5, 1.0])
    .range(["blue", "white", "red"]);

// use with color(x) where x is from 0 to 1;

也许用rgb值替换颜色关键字