d3 .csv包含大量数据,仅绘制一个月

时间:2016-05-11 11:50:42

标签: javascript csv d3.js

我使用d3生成条形图,我有一些CSV数据,其中包含2015年每天的4列数据。

  • 日期
  • Bar 1
  • Bar 2

我想要达到的目的是为条1和条2代表12条,并在它们上面添加一条线(我知道该怎么做)。

那么有人可以向我解释如何仅在本月的第一天显示条形图而不是每天都显示条形图而不更改数据吗?

1 个答案:

答案 0 :(得分:1)

nest的{​​{1}}功能对您有所帮助。它的工作原理如下:为表中的每个条目提供一个键(这里的键是月份),并为每组具有相同键的条目运行一个函数(这里,取条形码A和条形码B的平均值)。这给出了一个表d3

我假设您的日期表示为标准字符串“yyyy-mm-dd”

key -> value

此时,var monthdata = d3.nest() .key(function(d) { //get month from data (first 7 characters): return d.date.substring(0,7);}) .rollup(function(d) { //run this function where d is a set of entries with same month return { bar1: d3.sum(d, function(g) {return g.bar1; }) / d.length, //average of bar1 bar2: d3.sum(d, function(g) {return g.bar2; }) / d.length //average of bar2 } }) .entries(csv_data); 应具有以下形式:

monthdata

...已准备好插入d3条形图。