将整数量化为离散的桶

Question

我有一个约 7500 项的列表，它们都具有相似的签名：

{
    revenue: integer,
    title: string,
    sector: string
}

收入将在 0 到 10 亿之间。我想构建一个规模，这样，鉴于特定公司的收入..它 return 相对于以下 'buckets':

[=11=]-5 Million
-10 Million
-25 Million
-50 Million
-100 Million
0-250 Million
> 0 Million

我相信我应该能够使用 d3 中的量化或分位数比例来完成此操作，但在获得预期结果时遇到了困难。到目前为止，我有类似的东西：

var max_rev = 1000000000 // 1 Billion
scale = d3.scale.quantize().domain(_.range(max_rev)).range([5000000, 10000000, 25000000, 50000000, 100000000, 250000000])

一个明显的问题是调用 _.range(max_rev) 创建一个 10 亿项长的数组，所以我想知道如何更有效地做到这一点（比如 .domain([0 , 1000000000])?)

定义这个比例的最佳方法是什么，这样比例 (75000000) 就会 return 50000000。一旦我有了它，我就可以根据散列检查它，return 正确的标签：

{
    ...
    ...
    50000000: "-100 Million",
    100000000: "0-250 Million",
    ...

}

非常感谢！如果我可以提供任何其他信息，请告诉我。

Answer 1

量化尺度在这种情况下不起作用，因为您的域和范围没有统一划分。相反，您可以使用 threshold 比例尺。

这是一个例子：

var dollars = d3.format("$,d"),
  data = d3.range(100).map(function(d, i) {
      return {
          revenue: parseInt(Math.random() * 1000000000),
          title: "Company " + i,
          sector: "Sector " + parseInt(Math.random() * 10)
      }
  }),
  quantize = d3.scale.threshold()
                     .domain([5000000, 10000000, 25000000, 50000000, 100000000, 250000000])
                     .range([0, 5000000, 10000000, 25000000, 50000000, 100000000, 250000000]);

var table = d3.select("#info").append("table");

table.append("thead").append("tr").selectAll("th")
    .data(['company', 'sector', 'revenue', 'quantized_revenue'])
  .enter()
    .append("td")
    .text(function(d) {
      return d;
    });

var rows = table.append("tbody").selectAll("tr")
    .data(data)
  .enter()
    .append("tr")
    .attr("class", "company")

rows.append("td").text(function(d) {
    return d.title;
});
rows.append("td").text(function(d) {
    return d.sector;
});
rows.append("td").text(function(d) {
    return dollars(d.revenue);
});
rows.append("td").text(function(d) {
    return dollars(quantize(d.revenue));
});

table {
    width: 100%;
}
thead {
    background-color: #ccc;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<div id="info"></div>

有趣的部分是：

  quantize = d3.scale.threshold()
                     .domain([5000000, 10000000, 25000000, 50000000, 100000000, 250000000])
                     .range([0, 5000000, 10000000, 25000000, 50000000, 100000000, 250000000]);

domain 设置输入值与之比较的阈值，range 定义输出。恰好在这种情况下，range 与 domain 基本相同，但不一定如此。 range 可以是颜色值列表、定义条形高度的像素等。

您甚至可以这样做，并避免在散列中查找结果 table:

var dollars = d3.format("$,d"),
  data = d3.range(100).map(function(d, i) {
      return {
          revenue: parseInt(Math.random() * 1000000000),
          title: "Company " + i,
          sector: "Sector " + parseInt(Math.random() * 10)
      }
  }),
  quantize = d3.scale.threshold()
                     .domain([5000000, 10000000, 25000000, 50000000, 100000000, 250000000])
                     .range(["[=14=]-5", "-10", "-25", "-50", "-100", "0-250",  "> 0"].map(function(d) { return d + " Million"; }));

var table = d3.select("#info").append("table");

table.append("thead").append("tr").selectAll("th")
    .data(['company', 'sector', 'revenue', 'quantized_revenue'])
  .enter()
    .append("td")
    .text(function(d) {
      return d;
    });

var rows = table.append("tbody").selectAll("tr")
    .data(data)
  .enter()
    .append("tr")
    .attr("class", "company")

rows.append("td").text(function(d) {
    return d.title;
});
rows.append("td").text(function(d) {
    return d.sector;
});
rows.append("td").text(function(d) {
    return dollars(d.revenue);
});
rows.append("td").text(function(d) {
    return quantize(d.revenue);
});

table {
    width: 100%;
}
thead {
    background-color: #ccc;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.4.11/d3.min.js"></script>
<div id="info"></div>

将整数量化为离散的桶

Quantize Integers into discrete buckets

charts

quantization

quantile

d3.js