如何使用d3.js对分箱时间序列进行求和？

Question

我想要一个简单的图形,如:

我拥有的数据是一个包含两个属性的简单事务列表:

• 时间戳
• 量

我试过d3.layout.histogram().bins(),但它似乎只支持计算事务.

我不应该是唯一一个寻找那个的人,是吗？

Answer 1

好的,所以IRC人员帮助我指出nest,这很好用(这是CoffeeScript):

nested_data = d3.nest()
  .key((d) -> d3.time.day(d.timestamp))
  .rollup((a) -> d3.sum(a, (d) -> d.amount))
  .entries(incoming_data)  # An array of {timestamp: ..., amount: ...} objects

# Optional
nested_data.map (d) ->
  d.date = new Date(d.key)

这里的诀窍是d3.time.day需要一个时间戳,并告诉你时间戳属于哪一天(夜晚12点).这个功能和其他类似的东西d3.time.week可以很好地结合时间序列.

另一个技巧是nest().rollup()函数,它在被分组后key(),对给定的所有事件求和day.

我想要的最后一件事是在我没有交易的日子里插入空值.这是代码的最后一部分:

# Interpolate empty vals
nested_data.sort((a, b) -> d3.descending(a.date, b.date))
ex = d3.extent(nested_data, (d) -> d.date)
each_day = d3.time.days(ex[0], ex[1])

# Build a hashmap with the days we have
data_hash = {}
angular.forEach(data, (d) ->
  data_hash[d.date] = d.values
)

# Build a new array for each day, including those where we didn't have transactions
new_data = []
angular.forEach(each_day, (d) ->
  val = 0
  if data_hash[d]
    val = data_hash[d]
  new_data.push({date: d, values: val})
)

final_data = new_data

希望这有助于某人!