如何显示前n个项目的图形？

Question

I have a list of events and want to show who are the top participants (the ones that have come more often)

What I've done is a 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);

That kind of works, but there is a big "other" that I'd want to remove. Am I abusing the rowChart to create a topN graph?

Answer 1

So the path I followed is to filter the data first (by creating a fake group that has a new all() function that returns a top(n) of the real group):

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);

and for the graph, use this group

.group(filteredGroup);

I think it does the trick, despite Gordon's approval, still feels a bit hackish, but it does the job (cap+filter some data)

you have to remove the cap, or implement the top function (same as all in this case)

As a side note: rowChart seems to be one of the chart where you can override the data function, so:

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

would Work too (but wouldn't filter the "Not mentioned" items