在 DCjs 中绘制前 X 值（未计算 grouped/value）

Question

我想在行图中绘制维度的前 X 值，最好使用一个维度进行标记，但使用另一个维度的值作为条形大小。

基本上是如下所示的数据表示：

莎莉：1 弗雷德：0.7 鲍勃：0.5 弗朗西斯：0.4 乔治：0.2 山姆：0.18 苏珊：0.16 莎拉：0.15 汤姆：0.15 西蒙：0.14 ...

rowChart1 = dc.rowChart('#id')
valDim = ndx.dimension(function(d) {return d.data});
valGroup = valDim.group().reduceCount();
rowChart1.dimension(valDim).group(valGroup);

绘制值计数，而不是值本身。

具体来说，我希望制作前 N 个数据点的行图，其中条形的长度由数据点的值决定，而不是具有该值的数据点的数量。

即Sally 将有她自己的条，它将是 x 轴的 100%，而 Fred 的条将是 70%，而 Simon 的条将是 x 轴的 14%。

Answer 1

如果我正确理解你的问题，概念上的问题可能是维度的交叉过滤器定义（意思是 "a column that you bin and filter on"）与词的 English/math 定义（可能意思是 "any column of data" 或者可能表示图表上的几何方向。

每个图表上总是至少有一个几何 "dimension" 与 "crossfilter dimension" 无关，因为它是聚合的。在折线图中，Y 由一组 reduction/aggregation 驱动；在行图中 X 是。

我知道你的数据中有一列是唯一键，比如 name，你想将其映射到行 Y 轴，你还有第二列 x，您希望在不聚合的情况下在 X 轴行中进行编码。您可以使用 crossfilter 的 group.reduceSum()，因为每个 bin 中只有一条记录，所以 x 的总和就是 x。

由于 name 是唯一键，因此每个 name.

只有一个 x

假设您有这样的数据：

const data = [
  {name: 'Sally', x: 1},
  {name: 'Fred', x: 0.7},
  {name: 'Bob', x: 0.5},
  {name: 'Francis', x: 0.4},
  {name: 'George', x: 0.2},
  {name: 'Sam', x: 0.18},
  {name: 'Susan', x: 0.16}
 // ...
];

那么交叉过滤器初始化可能如下所示：

const xf = crossfilter(data),
  dim = xf.dimension(d => d.name), // bin and filter on this
  group = dim.group().reduceSum(d => d.x); // here be values

和图表

const rowChart = dc.rowChart('#row');

rowChart
  .dimension(dim)
  .group(group)
  .render();

Demo fiddle

如果您只想针对某些名称绘制 x，这听起来可能真的很复杂，但是 dc.js 和 crossfilter 针对图表之间进行过滤的情况进行了优化。不管他们绘制什么，crossfilter 总是会过滤行，将行排序到桶中，并减少这些桶。

如果你不使用过滤，那么这些库就太过分了。但是，如果您确实想要过滤，那么拥有一个包含处理它的数据模型的库真的很棒。

在 DCjs 中绘制前 X 值（未计算 grouped/value）

Plot the top X values in DCjs (not grouped/value counted)

crossfilter

dc.js