javascript - 使用 d3 和 dc.js 自定义时间线刻度

Question

我有下一张图表:

scrollChart
   ...
   .x(d3.time.scale().domain([startDate, endDate]))
   .round(d3.time.minutes)
   .alwaysUseRounding(true)
   .xUnits(d3.time.minutes);

如何更改 .xUnits 和 .round 以使用每 5/10/15 分钟作为时间间隔？

更新:

戈登的回答有帮助，但缩放后我遇到了新问题。

这是 5 分钟间隔:

缩放后，我的图表很糟糕:(过滤后如何将所有内容“重新分组”到 1 分钟间隔？这是真的吗？

Answer 1

谢谢Gordon求助。 我使用了 d3.js 版本 3 和 this话题。 首先，您需要复制d3_time_interval函数，因为它没有公开。

接下来我创建了函数并在分组中使用它。

const n_minutes_interval = (nMins) => {
    let denom = 6e4*nMins;
    return d3_time_interval(
         date => new d3_date(Math.floor(date / denom) * denom,
        (date, offset) => date.setTime(date.getTime() + Math.floor(offset) * denom, 
        date => date.getMinutes());
}

let myTimeInterval = n_minutes_interval(5);
let myGroup = dim.group(d => myTimeInterval(d)).someReduceFunction();