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() }
    }
  }
});