Question

我目前正在使用

的整个想法

var myQuantizeFunction = d3.scale.quantize()
                                 .domain(minMaxFromData) // the minmax using d3.extent
                                 .range(['bla-1', 'bla-2', 'bla-3', 'bla-4', 'bla-5']);

因此，当您想要在最小 - 最大值上生成图例时，这可以正常工作。问题是，我有一些数据回来为0.

以下是上下文的示例图例：

legend image

正如你所看到的，它的第一个或最低值是0到4.7，我真正想做的是拥有0（即没有）作为它自己的传奇项目并拥有一切在这种情况下，其他范围为1 - 33。

我希望能够指定第一个范围是0，然后在值＆gt;之间平均分割域。 0

有没有d3方式这样做？我确定其他人之前必须遇到同样的问题，我似乎无法找到它，但我可能没有使用正确的搜索字词。

Answer 1

来自文档：

quantize.domain（[号码]）

如果指定了数字，请将比例尺的输入域设置为   指定的两元素数字数组。如果数组包含更多   超过两个数字，只使用第一个和最后一个数字。如果   给定数组中的元素不是数字，它们将被强制转换为   数;当调用音阶时，这种强制行为同样发生。   因此，量化标度可用于编码可能的任何类型   转换为数字。如果未指定数字，则返回比例   当前输入域。

顾名思义，d3是数据驱动的＆＃39;因此忽略数据集的某些部分并不是其精神的一部分。

您需要编写自己的函数来生成[numbers]数组。

尝试：

data = [0,0,2,1,4,6,7,8,4,3,0,0];

min = undefined;
data.forEach(function (v) {
    if (v > 0) {
        if (typeof(min) === 'undefined') {
            min = v;
        } else if (v < min) {
            min = v;
        }
    }
})

var myQuantizeFunction = d3.scale.quantize()
                                 .domain([min, d3.max(data)])
                                 .range(['bla-1', 'bla-2', 'bla-3', 'bla-4', 'bla-5']);

Answer 2

我改进the latest solution以使用d3.min()并添加代码以测试量化函数。我还添加了一个小功能来着色输出。

以d3 datadriven方式完成所有工作

data = [0,0,2,1,4,6,7,8,4,3,0,0];
range = ['bla-1', 'bla-2', 'bla-3', 'bla-4', 'bla-5'];

//strip the first element
reducedRange = range.slice();
reducedRange.shift();

var myQuantizeFunction = 
    d3.scale.quantize()
      .domain([d3.min(data), d3.max(data)])
      .range(reducedRange);

var filterQuantize = function(d){
  if(d==0){
    return range[0];
  }else{
    return myQuantizeFunction(d);
  }
}

var colorize = d3.scale.category10();
// To test this we will put all the data in paragraphs
d3.select('body').selectAll('p').data(data)  .enter()
  .append('p')
  .text(function(d){return d+':'+filterQuantize(d);})
  .style('color',function(d){return colorize(d)});

View this code runing

希望这有帮助，祝你好运！

更新：我从评分中删除零，将其视为特殊情况，如您在评论中所指出的那样。

如何使用d3.domain / range来拥有自定义域

2 个答案:

quantize.domain（[号码]）