Javascript d3分位数标度力第一分位数

我正在建立一个从绿色到红色渐变的热图。我希望值

0

的单元格为绿色，值大于或等于

1

的单元格采用其他颜色。 我用这种方式构建天平：

var colors = [
  '#27C24C',
  '#7DB22E',
  '#D4A10F',
  '#F97C20',
  '#F35F40',
  '#FF0000'
];

var colorScale = d3.scale.quantile()
  .domain([0, d3.max(data, function (d) { return d.value; })])
  .range(colors);

但这会返回以下分位数：

[239.16666666666677, 478.3333333333332, 717.5, 956.6666666666664, 1195.8333333333335]

因此，我有以下热图：

---

但我希望点单元格是绿色的第二个阴影，因为它的值严格大于

0

在这种情况下不能只使用分位数。编写自定义比例函数以单独处理零值

var colors = [
  // '#27C24C', this value must not be included in the internal range
  '#7DB22E',
  '#D4A10F',
  '#F97C20',
  '#F35F40',
  '#FF0000'
];

var colorScaleInternal = d3.scale.quantile()
  .domain([0, d3.max(data, function (d) { return d.value; })])
  .range(colors);

var colorScale = function(value) {
  return !!value ? colorScaleInternal(value) : '#27C24C';
};

---

虽然我在D3中找不到对此功能的支持，但我可以通过修改发送到D3的范围数组来解决这个问题。我们的想法是通过D3检查四分位数是否重复，如果重复，则保持所有四分位数的颜色相同：

var scale = d3.scale.quantile().domain(domain).range(range);

var quantiles = scale.quantiles();
quantiles.unshift(d3.min(domain));

// Now that you have the quantiles, you can see if some of them are holding the same value, 
// and it that case set the minimum value to all of them.
var modifiedRange = [range[0]];
for (var i = 1; i < range.length; i++) {
    if (quantiles[i] === quantiles[i - 1]) {
        modifiedRange.push(modifiedRange[i - 1]);
    } else {
        modifiedRange.push(range[i]);
    }
}

// set the new scale
scale.range(modifiedRange);

var scale=d3.scale.quantile（）.domain（域）.range（范围）；
var分位数=标度。分位数（）；
分位数不移位（d3.min（域））；
//现在你有了分位数，你可以看到他们中的一些是否持有相同的值，
//在这种情况下，将最小值设置为所有值。
var modifiedRange=[range[0]]；
对于（变量i=1；i

您可以共享您的数据集吗？或者更好，如果你提供了小提琴的代码什么是

代表？两个负运算符将值的类型“转换”为布尔值。如果该值为零，
！！值
为
假
。否则，它是
真的
。