【问题标题】:dc.js dimension group orderingdc.js 维度组排序
【发布时间】:2014-08-07 16:22:12
【问题描述】:

我正在尝试渲染一个 dc.js barChart,其中我的 y 轴是百分比 0-100%,我的 x 轴是数字,但是我想按日期对 x 轴进行排序。

我的数据如下所示:

date,trend,percent
01/01/2014 13:00,238,53.6
01/01/2014 13:15,239,64.2
01/01/2014 13:30,219,43.1
01/01/2014 13:45,219.2,43.1
01/01/2014 14:00,237.4,50.6
...

我正在将数据添加到交叉过滤器

data.forEach(function (d) { d.date = parseDate(d.date); });

var ndx = crossfilter(data);

var trendDimension = ndx.dimension(function (d) { return d.trend; });
var trendGroup = trendDimension.group().reduce(
  function (p, v) {
    p.time = v.date.getTime();
    p.trend = +v.trend;
    p.percent = +v.percent;
    return p;
  },
  ...
).order(function (p) { return p.time; }); // ??? order by time rather than trend

当我绘制维度和组时,我的 x 轴按趋势排序,因为我的 x 域看起来像:

var minTrend = trendDimension.bottom(1)[0].trend;
var maxTrend = trendDimension.top(1)[0].trend;

...
chart.x(d3.scale.linear().domain([minTrend, maxTrend]);
...
chart.render();

一切都在绘制,但条形图按趋势顺序排序,我希望它们按日期/时间顺序排序。

这可能吗?

编辑

我也试过了:

chart.ordering(function (d) { return d.value.time; });

但这似乎对排序没有影响......

【问题讨论】:

    标签: javascript dc.js crossfilter


    【解决方案1】:

    您想绘制百分比与趋势还是百分比与时间的关系图?

    现在您的尺寸处于流行趋势,因此无法按日期订购。 Crossfilter 将为每个趋势值(可能有很多日期)创建一个 bin,并且按照您编写 reduce 函数的方式,它将简单地将 bin 的日期条目替换为它看到的最后日期。

    如果您想按日期排序,然后使用趋势来影响其他美学(例如颜色),您应该使用日期维度,按日期的某种量化分组,不要对缩减中的日期做任何事情,并使用日期刻度/xUnits。

    【讨论】:

    • 感谢您的回复,我对维度的用途感到困惑..
    • 没错,维度可能意味着很多事情。在 crossfilter 中,它几乎意味着“您过滤和分类的内容”。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2017-06-02
    • 1970-01-01
    • 2016-06-21
    • 1970-01-01
    • 2015-05-09
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多