javascript - Dygraphs 仅显示年份日期值

Question

我正在开发一个条形图来显示与一系列其他年度值相比的年度汇总值。这些值是与上一年相比一年的总用水量，依此类推。我不知道如何将我的 CSV 中的日期字段格式化为单个年度值。假设它必须是 20130101 之类的东西，我如何自定义 x 轴标签以仅显示 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} 
);

Answer 1

您想将 x 轴的 axisLabelFormatter 选项设置为仅输出年份的函数。可能还有 valueFormatter 选项。有关灵感，请参阅 http://dygraphs.com/options.html#axisLabelFormatter和http://dygraphs.com/tests/value-axis-formatters.html。

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

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