如何显示前n项的图表?

时间:2015-04-28 10:26:39

标签: d3.js dc.js crossfilter

我有一系列活动,想要展示谁是最受欢迎的参与者(那些经常来的参与者)

我所做的是一个rowChart

var dim = ndx.dimension (function(d) {
  if (!d.guest) {
      return "Not mentioned";
  }
  return d.guest;
});

var group = dim.group().reduceSum(function(d) { return 1; });
var graph = dc.rowChart (".topvisitor")
  .margins({top: 0, right: 10, bottom: 20, left: 10})
  .height(300)
  .width(200)
  .cap(10)
  .x(d3.scale.ordinal())
  .elasticX(true)
.ordering(function(d){return -d.value})
  .dimension(dim)
  .group(group);

这种作品,但有一个很大的"其他"我想删除。我是否滥用rowChart来创建topN图?

1 个答案:

答案 0 :(得分:3)

所以我遵循的路径是首先过滤数据(通过创建一个假组,该组具有一个返回真实组顶部(n)的新的all()函数):

var group = dim.group()。reduceSum(function(d){return 1;});

var filteredGroup = (function (source_group) {return {
  all:function () {
    return source_group.top(10).filter(function(d) {
      return d.key != "Not mentioned";
     });
  }
};})(group);

并且对于图表,请使用此组

。集团(filteredGroup);

我认为尽管戈登获得批准,但仍然感觉有些过时,但它确实起作用(上限+过滤一些数据)

你必须删除上限,或实现top函数(在这种情况下与所有相同)

作为旁注:rowChart似乎是可以覆盖数据功能的图表之一,因此:

.data(function (group) {
      return group.top(10);
})

也会起作用(但不会过滤“未提及”的项目