Dygraphs显示仅年份的日期值

时间:2013-06-04 13:23:49

标签: javascript dygraphs

我正在开发一个条形图,以显示与一系列其他年度值相比的年度汇总值。这些值是一年的总耗水量与上一年相比,依此类推。我无法弄清楚如何在CSV中格式化我的日期字段以获得单个年度值。假设它必须像20130101那样,我如何自定义x轴labl以显示2013 2012 2011等?

CSV

Date,Litres 
2012,42047 
2013,18604.5

代码

g4 = new Dygraph(document.getElementById("year"),
                 "192.168.252.30/monitoring/data_water_year.php",
                 {legend: 'always', 
                  title: 'Yearly Water Usage', 
                  xlabel: 'Date', 
                  ylabel: 'Litres', 
                  includeZero: true, 
                  animatedZooms: true, 
                  drawXGrid: false, 
                  plotter: barChartPlotter} 
);

1 个答案:

答案 0 :(得分:5)

您希望将x轴的axisLabelFormatter选项设置为仅输出年份的函数。也可能是valueFormatter选项。看到 <{3}}和http://dygraphs.com/options.html#axisLabelFormatter获取灵感。

您的代码最终会看起来像这样:

new Dygraph(div, data, {
  axes: {
    x: {
      axisLabelFormatter: function(d) { return d.getFullYear() },
      valueFormatter: function(ms) { return new Date(ms).getFullYear() }
    }
  }
});